боковая панель закрывает нижний колонтитул в Internet Explorer 6 и 7

Question

Я разработал шаблон для WordPress, проблема в том, что когда боковая панель становится длиннее, некоторые из них будут закрывать нижний колонтитул в Internet Explorer 6 и 7, адрес веб-сайта: http://blog.baabak.ir (на персидском языке), но если вы посмотрите на это в Internet Explorer 6,7, то увидите, что логотип боковой панели закроет нижний колонтитул, например, на этой странице:

http://blog.baabak.ir/?page_id=141

но в других браузерах сайт работает нормально, в чем проблема?

Answer 1

Оберните два столбца в div и установите его, чтобы очистить как заголовок, так и нижний колонтитул.

Answer 2

Не уверен, что это все еще активно, однако, поскольку я нашел это легко в Google, другие тоже будут. Я полностью согласен с очисткой поплавков, это важно, однако может возникнуть еще одна «проблема», если ваша боковая панель: position: absolute; или любая другая позиция для вашей боковой панели, вот в чем проблема.

т.е. в моем случае это было:

#sidebar {
    margin: 120px 0 0 0;
    float: right;
    width: 235px;
    left: 733px;
}

боковая панель расположена именно там, где я и хотел, и она "толкает" нижний колонтитул, а не переполняет его или в некоторых ситуациях проваливается.

Answer 3

вы должны обязательно использовать clear:both;, когда вы используете float в CSS

ваш <div id="main_content"> не должен быть плавающим.

только боковая панель должна быть установлена ​​с float:left, если вы хотите правую боковую панель, вы должны сделать float:right.

см. учебное пособие о том, как сделать двухколонный жидкостный дизайн.

+---------------------------------------------+
+ HEADER (no float)                           +
+---------------------------------------------+
+ Sidebar float:left + content (no float)     +
+---------------------------------------------+
+ footer (no float)                           +
+---------------------------------------------+

сейчас ваша страница похожа на эту

+---------------------------------------------+
+ HEADER (no float)                           +
+---------------------------------------------+
+ Sidebar float:left + content (float:right)  +
+---------------------------------------------+
+ footer (no float)                           +
+---------------------------------------------+

которые создают вашу проблему