Т.е плавающий правильный баг? - PullRequest
Новая
       30

Т.е плавающий правильный баг?

0 голосов
/ 17 ноября 2009

У меня есть право с плавающей точкой. Внутри этого div есть два других div. Первый div имеет цвет фона, и когда я обновляюсь, он «кровоточит» во второй div. (Иногда перед ним, иногда за ним.) Когда я прокручиваю, он исправляется. Когда я обновляю, он делает это снова. Это происходит только в IE7. Ошибка? код ниже 

#sidebar {float:right;width:310px;}
#articleSidebar {background:#DEE7E7;margin:0 5px 20px 5px;position:relative;}
#articleSidebarHeader {margin-top:10px;padding:5px;}
#articleSidebar h2, #articleSidebarHeader h2 {color:#5A5A5A;font-size:14px;font-weight:bold;}
#articleSidebar ul {color:#5A5A5A;font-size:11px;padding:0 7px;}
#articleSidebar ul li {background: transparent url(../images/bulletSquare9C.png) no-repeat scroll left 6px; padding:0 0 10px 7px;}
#articleSidebar ul li a {color:#5A6B73;display:block;text-decoration:underline;}
#articleSidebar ul li a strong {font-weight:bold;}
#sidebarAd {margin:0 5px 20px 5px;position:relative;}





<div id="sidebar">
        <div id="articleSidebar">
            <div id="articleSidebarHeader">
                <h2>Title here TBD</h2>
            </div>
            <ul>
                <li><a href="replaceMe">link</a>text</li>
                <li><a href="replaceMe">link</a>text</li>
                <li><a href="replaceMe">link</a>text</li>
                <li><a href="replaceMe">link</a>text</li>
            </ul>
        </div>
        <div id="sidebarAd">
        <!--300x250 ad here-->
        <iframe src="http://www.google.com" height="250" width="300" scrolling="no" frameborder="0"></iframe>
        </div>
    </div>

Ответы [ 2 ]

2 голосов
/ 27 декабря 2011

В IE6 и 7 я обычно играю с position:static и zoom:1, что может решить проблему.

0 голосов
/ 17 ноября 2009

Я думаю, что вы относительное расположение является частью проблемы. Оба DIV имеют одинаковое относительное расположение. Я думаю, что, возможно, в IE7 положение и высота / ширина исходного положения элементов перед применением «относительного» позиционирования не рассчитываются правильно.

Исправления, которые приходят на ум:

  1. Использовать абсолютное позиционирование. Это удаляет элементы из DOM до изменения положения, не занимая места, которое они занимали бы на странице. В этом случае значения позиционирования не могут быть одинаковыми или они будут перекрывать друг друга.

  2. Предпочитаемый метод Используйте «плавающие» элементы div для достижения того же эффекта, что и при прослушивании. Вместо относительного позиционирования можно указать определения CSS полей для достижения того же визуального макета. 

    #articleSidebar {background:#DEE7E7;float:left;margin:0 5px 20px 5px;}    
#sidebarAd{margin:0 5px 20px 5px;float:left;}
...