Layout Theme Problem in Explorer [Content gets pushed down] (4 posts)

  1. missmushroom
    Posted 8 years ago #

    Cheers everyone :)

    I am having a bit of a problem with my wordpress layout. I used discus102 and tweaked the codes so that my blog fits the theme of my main website.

    I have tested my layout in most of the browsers and the only problem is coming from Explorer. The top navigation is missing which I think is due to the search form at the top right of my webpage being pushed down. My main content is also being pushed down.

    I really can't get my head around this one. It looks fine in the other browsers. Any help is truly and greatly appreciated.

    Screenshot of problematic areas:
    Explorer 7.0: http://www.sultryain.com/blog/wp-content/themes/discus-102/images/080219-214616-msie-7.0-windows-xp-cb5fd0a81f9590ab4ac34e9232406bba.jpg
    Explorer 5.5: http://www.sultryain.com/blog/wp-content/themes/discus-102/images/080219-212920-msie-5.5-windows-2000-510e504de7394b6052d22efca400942a.jpg
    Explorer 6.0: http://www.sultryain.com/blog/wp-content/themes/discus-102/images/080219-212923-msie-6.0-windows-2000-3ca04fff28c92fdf613bfa5bd598aa47.jpg

    And how it should be looking like:
    Firefox: http://www.sultryain.com/blog/wp-content/themes/discus-102/images/080219-212854-firefox-

    HTML Code: http://sultryain.com/blog

    CSS Code:

    /* page margins */
    #blog {width: 800px;background:#ffffff;overflow: hidden;}
    .wrapper{position: relative; width: 900px; margin: 0 auto; text-align: left; font-family	: Verdana, Helvetica, sans-serif;
    background-color: #fff;	color: #333;line-height	: 130%;}
    /* header */
    #banner {background: #fff;width: 800px;	height: 160px;padding: 0;margin: 0;overflow: hidden;}
    #topleft {padding: 0;width:185px;height: 80px;text-align:center;margin:10px 0 10px 10px;float:left;}
    #banner img {border: none;}
    /* main content  */
    .main { position: relative; display	: block; float	: left; left	: 17px; margin	: 15px 0 0 0; width	: 470px;}
    /* search form */
    #search {width: 130%;margin-left: 75%; margin-bottom:20px;}
    #search .s{background:#FFEEC2;}
    .title{text-align: center;margin-top: 6px;font-family:Verdana, Helvetica, sans-serif; text-decoration: none;color: #E0427F;
    font-size: 1.2em;font-weight:bold;}
  2. moshu
    Posted 8 years ago #

    It is always one single reason: something too wide in a narrow container.
    Since usually the sidebars are on the right in a blog... you will find hundreds of post if you search for "sidebar down IE".

  3. missmushroom
    Posted 8 years ago #


    Sorry i realized that there is a duplicate of this post. I tried posting my whole CSS and HTML code earlier but realized it was against the forum rule (should have read the stick notes). Since I could not see my post I assumed it was automatically deleted but it was not.

  4. moshu
    Posted 8 years ago #

    Now it is deleted :)

Topic Closed

This topic has been closed to new replies.

About this Topic