Forums

The forums ran from 2008-2020 and are now closed and viewable here as an archive.

Home Forums CSS IE centering – I thought we all had it figured out.

  • This topic is empty.
Viewing 4 posts - 1 through 4 (of 4 total)
  • Author
    Posts
  • #22575
    landonwisely
    Member

    I would bet this would fall under the ‘just let someone else look at it’ they’ll tell you the one semi colon or hyphen you forgot…. type of thing. However, I’m really racking my brain on this one.

    I’m throwing together a new site… and I’m styling the blog…

    I get it looking fine and dandy in FF (haven’t checked Opera/Safari) but the #wrap element is not being centered properly in IE.

    Here’s my stylesheet, and a link if you wanna see it that way.

    Code:
    html, body, div, object, h1, h2, h3, h4, h5, h6, p, a, del, dfn, em, font, img, strong, b, u, i, center, ul, li, form, label {
    margin: 0;
    padding: 0;
    border: 0;
    outline: 0;
    font-size: 100%;
    font-weight: normal;
    vertical-align: baseline;
    background: transparent;
    }

    body {
    line-height: 16px;
    text-align: center;
    background: #1b1a1a;
    color: #ccc;
    font-family: Georgia, “Times New Roman”, Times, serif;
    font-size: 13px;
    }

    ol, ul {list-style: none;}

    :focus {outline: 0;}

    del {text-decoration: line-through;}

    a {text-decoration: none;}

    h2 {
    font-size: 24px;
    padding: 5px 0px 5px 0px;
    }

    h4 {font-size: 20px;}

    #wrap {
    margin: 0px auto;
    min-height: 100%;
    width: 702px;
    }

    #header {
    width: 702px;
    height: 242px;
    }

    #title {
    width: 275px;
    height: 48px;
    text-align: center;
    padding-top: 10px;
    float: left;
    }

    #style {
    width: 150px;
    height: 16px;
    text-align: center;
    padding: 3px 0px 3px 0px;
    float: right;
    }

    #menubar {
    width: 702px;
    height: 25px;
    text-align: right;
    font-size: 16px;
    margin-top: -32px;
    padding-top: 7px;
    }

    #menuline {
    width: 702px;
    position: relative;
    height: 22px;
    overflow: visible;
    }

    #pictureselect {
    position: relative;
    height: 1%; /* ie bug */
    }
    #menuline ul, #pictureselect {
    padding: 0;
    margin: 0;
    }

    #menuline ul li, #pictureselect li {
    float: right;
    list-style: none;
    }
    #menuline ul li a, #pictureselect li a {
    z-index: 8;
    float: left;
    position: relative;
    overflow: hidden;
    height: 22px;
    text-decoration: none;
    text-align: center;
    }

    #button1 a, #button2 a, #button3 a, #button4 a, #button5 a {width: 75px;}

    #content {
    width: 702px;
    padding-bottom: 153px;
    margin: 0 auto;
    text-align: justify;
    padding: 0 0 0 0;
    }

    #content p img {float: left;}

    ul#picker li, ul#footerInside li {display: inline;}

    ul.links li.right, ul#footerInside li#subscribe {float: right;}

    #footer {
    position: relative;
    width: 702px;
    height: 150px;
    margin: -150px auto 10px auto;
    }

    ul#footerInside li#copyright {float: left;}

    ul#footerInside {padding-top: 3px;}

    .post {
    padding: 28px 0 20px 0;
    }

    .post h2 {
    font-size: 1.9em;
    font-weight: normal;
    margin: -10px 20px 0 30px;
    }

    .post h2.single {margin: -10px 20px 12px 30px;}

    .post .data {
    font-size: 1em;
    font-weight: normal;
    margin: 0 20px 15px 50px;
    }

    .post h3 {
    font-size: 1.3em;
    font-weight: normal;
    margin: 25px 20px -10px 0;
    }

    #content>.post h3 {margin-bottom: 8px;} /* FF Specific */

    .entry {
    width: 700px;
    margin: 0 auto;
    }

    .postmetadata {
    width: 682px;
    margin: 25px auto 15px auto;
    text-align: center;
    font-size: 0.9em;
    padding: 8px 10px;
    }

    .postmetadata#single {
    margin: 0 auto 30px auto;
    background-color: #000;
    }

    .postmetadata small { font-size: 0.8em; }

    blockquote {
    margin: 10px 0 10px 30px;
    padding: 0 0 0 5px;
    }

    .post ul {
    margin: 10px 0 ;
    padding: 0 0 0 37px;
    }

    .navigation {
    width: 447px;
    height: 18px;
    margin: 0 auto;
    font-size: 0.8em;
    padding: 8px 40px;
    }

    .alignleft {
    float: left;
    text-align: left;
    }

    .alignright {
    float: right;
    text-align: right;
    }

    #commentformarea {
    width: 702px;
    margin: 0 auto 8px auto;
    padding: 8px 10px;
    }

    #commentform {margin: 15px 0 10px 40px;}

    #commentformarea h3 {
    font-size: 1.3em;
    font-weight: normal;
    margin: 10px 0 15px 20px;
    }

    #commentform p { margin: 0 0 3px 0;}

    #commentform input, #commentform textarea {
    padding: 3px;
    font-family: Verdana, Geneva, Helvetica, Arial, sans-serif;
    font-size: 0.8em;
    }

    #commentform textarea {width: 420px;}

    #commentform input#submit {
    font-family: Georgia, “Book Antiqua”, “Souvenir Lt BT”, “Times New Roman”, serif;
    width: 130px;
    }

    h4 {
    margin: 25px 0 20px 0;
    text-align: center;
    font-weight: normal;
    }

    ol.commentlist {
    width: 426px;
    list-style: none;
    margin: 0 auto 60px auto;
    padding: 0;
    font-size: 0.9em;
    }

    ol.commentlist li {
    margin: 0 0 20px 0;
    padding: 20px 0 0 0;
    }

    ol.commentlist p.await_mod {margin: 0 0 8px 0;}

    ol.commentlist p { margin: 0 0 10px 0; }

    .sanda h2 {
    font-size: 1.9em;
    font-weight: normal;
    margin: 35px 0 0 0;
    text-align: center;
    }

    .sanda>h2 { margin: 15px 0 0 0; } /* FF Specific */

    .sanda h3 { margin: 0 40px 15px 40px; }

    ul#sidebar {
    width: 700px;
    margin: 8px auto 0 auto;
    padding: 0 0 25px 0;
    }

    #wrap>#sidebar { padding: 15px 0 25px 0; } /* FF Specific */

    #sidebar_wrap {
    width: 680px;
    margin: 15px 15px 0 45px;
    padding: 0 0 -20px 0;
    }

    #sidebar>#sidebar_wrap { margin-top: 0; } /* FF Specific */

    ul#sidebar li, ul#sidebar li ul, ul#sidebar li ul li {
    margin: 0;
    padding: 0;
    list-style: none;
    text-align: left;
    }

    #sidebar li h2 {
    margin: 0;
    font-weight: normal;
    font-size: 1.6em;
    width: 1339px;
    }

    ul#sidebar li {
    width: 139px;
    float: left;
    margin: 0 0 15px 0;
    padding: 0;
    }

    ul#sidebar li ul {
    width: 135px;
    padding: 5px 0 15px 10px;
    }

    ul#sidebar li ul li { width: 130px;}

    input#s {
    width: 440px;
    margin: 0 13px -20px 0;
    padding: 4px 0;
    text-align: center;
    }

    div>input#s {margin-bottom: 0; margin-top: 15px;} /* FF Specific */

    .feedicon {
    width: 20px;
    height: 20px;
    }

    #footer p {
    margin: 0 0 15px 0;
    padding: 15px 0 0 0;
    font-size: 0.7em;
    }

    #wrap>#footer p { margin: 0; padding: 15px 0 15px 0; } /* FF Specific */

    a {color: #fff;}

    h2, h4 {color: #2b7e88;}

    h2 a, h3 a {color: #2b7e88;}

    #header {background: url(http://landonwisely.com/test/black/images/header.jpg);}

    #title {
    font-size: 10px;
    color: #fff;
    background: #1b1a1a;
    filter:alpha(opacity=70);
    -moz-opacity:0.7;
    opacity: 0.7;
    }

    #title a {color: #2b7e88;}

    #style {
    color: #1b1a1a;
    background: #ccc;
    filter:alpha(opacity=80);
    -moz-opacity:0.8;
    opacity: 0.8;
    }

    #menubar {
    background: #1b1a1a;
    filter:alpha(opacity=70);
    -moz-opacity:0.7;
    opacity: 0.7;
    border-bottom: 3px solid #0e0d0d;
    }

    #content {background: #1b1a1a;}

    #menuline ul li a, #pictureselect li a {color: #fff;}

    #menuline li.background {
    background: url(http://landonwisely.com/test/images/bg_menu_right.png) no-repeat top right !important;
    //filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(enabled=true, sizingMethod=image src=’//landonwisely.com/test/images/bg_menu_right.png’);
    background: url(http://landonwisely.com/test/images/bg_menu_right.gif) no-repeat top right;
    z-index: 8;
    position: absolute;
    visibility: hidden;
    margin-top:25px;
    }

    #menuline .background .left {
    background: url(http://landonwisely.com/test/images/bg_menu.png) no-repeat top left !important;
    //filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(enabled=true, sizingMethod=image src=’//landonwisely.com/test/images/bg_menu.png’);
    background: url(http://landonwisely.com/test/images/bg_menu.gif) no-repeat top left;
    height: 1px;
    margin-right: 7px;
    }

    http://landonwisely.com/blog

    I toyed with the doctype thinking maybe I messed something up there, but I don’t think that’s it. I’m slightly sleep deprived, so perhaps that needs to be counted into the equation.

    thanks in advance.
    -my inner noob

    #47043
    landonwisely
    Member

    @edwin, I did actually design it myself (glad you like)

    here’s the whole image. It is a 2 year old design, that I don’t toy with much, so it’s a bit rough around the edges.
    [img]http://landonwisely.com/test/images/starsalign/01.jpg[/img]

    RE: the problem….

    this is in the body selector of the css.

    Code:
    body {text-align: center;}

    and text-aligning the #wrap left didn’t change anything either.

    I have looked at this in IE6 and it’s not centering.

    I’m really confused on this one, which is why I broke down and posted something here.

    #47045
    landonwisely
    Member

    Oh yeah, the wordpress theme I started frankensteining had the @import, and I never got rid of it…

    sadly, still no dice.

    #47051
    landonwisely
    Member

    @box….

    you’re right. wow. I probably would have spent days digging and not found that.

    big thanks. i guess my oafish fingers hit the 3 one time too many.

    again, big.big. thanks.

Viewing 4 posts - 1 through 4 (of 4 total)
  • The forum ‘CSS’ is closed to new topics and replies.