Web Analytics Made Easy -
StatCounter Page messed in IE - CodingForum

Announcement

Collapse
No announcement yet.

Page messed in IE

Collapse
X
 
  • Filter
  • Time
  • Show
Clear All
new posts

  • Page messed in IE

    Need some help guys. Check out http://www.madbum.com in IE. The menu drops below the content area. Here is my stylesheet, please let me know what is wrong (and if you see anything here that would fix the top nav not being perfectly centered in firefox, let me know too):

    body{

    margin:0;

    background-image:url(images/bg.jpg);

    background-position:center;

    background-repeat:repeat-y;

    background-color:#3D3D3D;

    }



    a:link {

    color: #F1F1F1;

    text-decoration: none;

    }

    a:visited {

    color: #F2F2F2;

    text-decoration: none;

    }

    a:hover {

    color: #F89C91;

    text-decoration: underline;

    }

    body,td,th {

    font-size: 15px;

    font-family: Geneva, Arial, Helvetica, sans-serif;

    color: #F4F4F4;

    }



    #header{

    background-image:url(images/header.jpg);

    width:682px;

    height:256px;

    margin:0 auto;

    }

    #topnav{

    padding-top:200px;

    }

    #topnav ul{
    margin:0px 0px 0px 0px;
    text-align: center;
    }

    #topnav li{
    list-style:none;
    display:inline;
    font-weight:bold;
    padding: 0 1em;
    }

    a:active {

    text-decoration: none;

    }

    #content{

    width:682px;

    margin:0 auto;

    }

    #main{

    float:left;

    width:500px;

    background-color:#262524;

    border:1px solid #3D3D3D;

    margin-left:5px;

    margin-right:4px;

    padding:5px;
    display:inline;

    }

    #sidebar{

    float:left;

    width:155px;

    background-color:#660000;

    border:1px solid #3D3D3D;

    height:900px;

    padding-left:4px;

    background-image:url(images/trash.jpg);

    background-position:bottom;

    background-repeat:no-repeat;
    display:inline;

    }

    #sidebar ul{

    list-style:none;

    margin:0px 0px 0px 0px;

    padding:0px 0px 0px 0px;

    }

    #sidebar li{

    list-style:none;

    }

    #sidebar li li{

    text-indent:2px;

    }

    #sidebar h2{

    margin:8px 0px 2px 0px;

    font-size:16px;

    font-family:Arial;

    font-style:italic;

    font-weight:bold;

    color:#000000;

    border-left:2px solid #000000;

    border-bottom:2px dashed #000000;

    }

    #sidebar #s{

    margin-top:20px;

    font-size:12px;

    color:#333333;

    background-color:#FFCCCC;

    border:1px solid red;

    }

    #sidebar #searchsubmit{

    background-color:#660000;

    color:#FFFFFF;

    border:1px inset black;

    font-size:12px;

    }

    #footer{

    clear: both;

    width:682px;

    height: 50px;

    margin:0 auto;

    background-image:url(images/footer.jpg);

    background-position:bottom;

    background-repeat: no-repeat;

    }

    #footer div{

    padding-top:31px;

    text-align: center;

    padding-right:10px;

    }

    #footer a{

    font-weight:bold;

    }

    #main .post{

    font-family:Verdana, Arial, Helvetica, sans-serif;

    }



    #main .post h2{

    margin:0;

    color:#FFCCCC;
    font-size:17px;
    font-weight:bold;

    }

    #main .post small{

    color:#999966;

    margin:3px;

    }

    #main .entry{

    color:#EEEAE3;

    margin:2px;

    }

    #main .post h2:first-letter{

    }

    #main .pagetitle{

    color:#FFCCCC;

    font-styleblique;

    border-left:4px solid red;

    padding-left:10px;

    margin-left:10px;

    }

    #main .post h2 a:link{

    color:#FFCCCC;

    }

    #main .post h2 a:visited{

    color:#FFCCFF;

    }

    #main .post h2 a:hover{

    color:#FF0000;

    }



    #main .post h3 a:link{

    color:#FFCCCC;

    }

    #main .post h3 a:visited{

    color:#FFCCFF;

    }

    #main .post h3 a:hover{

    color:#FF0000;

    }





    #main .postmetadata{

    font-size:10px;

    color:#999999;

    }

    #main .postmetadata a{

    font-style:italic;

    }

    #comment{

    width:90%;

    background-color:#FFCCCC;

    font-family:Verdana, Arial, Helvetica, sans-serif;

    font-size:16px;

    }

    #submit{

    font-size:14px;

    color:#FFFFFF;

    background-color:#660000;

    border:1px solid red;

    }



    #gglads{

    text-decoration: none !important;

    }

  • #2
    try this for your #topnav ul CSS
    Code:
    #topnav ul{
    margin:0;
    padding:0;
    text-align: center;
    }
    ||||If you are getting paid to do a job, don't ask for help on it!||||

    Comment


    • #3
      Thanks aerospace, that got the header part. Any ideas on the sidebar guys?

      Comment


      • #4
        I would try declaring the divs differently in your html.

        Should be as follows:

        header div

        nav div

        sidebar right div

        content div

        I had a similar problem, I would be surprised if this does not fix it.
        Once I thought I was wrong but I was mistaken.

        Comment


        • #5
          You mean differently than having it as <div id="sidebar"> <div id="header"> etc?

          Comment


          • #6
            As in I declare all my major divs in the order in which they will be rendered assuming top to bottom, right to left.

            so on the html page I declare

            header
            nav bar
            rightsidebar
            center content
            leftsidebar (if existent)
            footer

            And of course if there are elements inside the content part they go inside that div tag respectively.
            Once I thought I was wrong but I was mistaken.

            Comment


            • #7
              Hm, but there is no html page. There are just separate php pages

              Comment


              • #8
                change the width of #main to 490, currently your overall width of main is 510px, I think you wanted it to be 500px total but padding counts for overall width as well.
                ||||If you are getting paid to do a job, don't ask for help on it!||||

                Comment


                • #9
                  ... The php pages are still written in html markup, you just save them as .php so that the server reads the php functions within the hypertext document properly. Wherever it was that you declared the divs.
                  Once I thought I was wrong but I was mistaken.

                  Comment


                  • #10
                    Ok, thought you were referring to something else then.

                    I'm not sure if declaring the divs would fix the problem though since the menu used to be fine but I changed a few padding things (padding with the menu itself, not outside of it) and all of a sudden it changed

                    Comment

                    Working...
                    X