Sidebar Drops Down in Internet Explorer 6 and lower

  • wildhalf

    (@wildhalf)


    15 years, 10 months ago

    Hi,

    I’m having a little problem with my blog. The sidebar drops down to the end of my content on every page in IE 6 and lower.

    It works perfect in all other browsers, firefox, I.E 7, etc

    http://www.p90x.ws

    I followed the following steps

    Step 1. Validated sit at W3C’s Validator! Site had errors but i fixed them and all is ok now.

    Step 2. Checked Images Width – images are Ok but it happens on all pages even witout images.

    Step 3. Reduced the size of the ‘Content Area’ & ‘Sidebar’

    has anybody got and ideas on how i can fix this. I will supply code if needed.

Viewing 2 replies - 1 through 2 (of 2 total)
  • Thread Starter wildhalf

    (@wildhalf)

    15 years, 10 months ago

    I managed to fix the probelm… My Theme had a CSS file for IE7, so i copied this and kept adding things to it till i got IE6 working.

    I found the following code to the Header.php file

    <!--[if ie 7]>
<link rel="stylesheet" type="text/css" media="screen" href="<?php bloginfo('stylesheet_directory'); ?>/ie-win.css" />
<![endif]-->

    This code displays a different CSS file if you are using IE7. So i added the code below under this which displays a different CSS file again for any version of IE less than 7 (i.e lt = less than)

    <!--[if lt ie 7]>
<link rel="stylesheet" type="text/css" media="screen" href="<?php bloginfo('stylesheet_directory'); ?>/ie_style.css" />
<![endif]-->

    I then changed the following code adding ‘overflow: hidden;’ to #content-wrapper and adding in #content, #sidebar-wrapper and #sidebar from my main style.css also. And last but not leaast i had to change the width on #content-wrapper to 73% and the width on #sidebar-wrapper to 25%

    #content-wrapper { width: 73%; overflow: hidden; }

#content pre { width: 360px; overflow: hidden; }

#content
{
	float: left;
        overflow: hidden;
}

#sidebar-wrapper
{
	width: 25%;
	float: right;
	margin-top: 20px;
       overflow:hidden;
}

#sidebar
{
        float: right;
	padding: 0px 15px 10px 10px;
	width: 200px;
	margin-right: 15px;
	margin-top: 0px;
        overflow:hidden;
}
    sleektest

    (@sleektest)

    15 years, 4 months ago

    You are God sent wildhalf.

Viewing 2 replies - 1 through 2 (of 2 total)
  • The topic ‘Sidebar Drops Down in Internet Explorer 6 and lower’ is closed to new replies.

Tags