выпуск поплавка

Question

У меня возникла проблема, когда я установил 2 плавающих элемента div, один из которых содержит элемент select , когда на странице, загруженной в div, не возникло проблемы, но как только я щелкнул элемент (s) в поле выбора, div, который расположен в правом смещении вниз?

Вот пример кода, о котором я говорю:

#div1,#div2{float:left}
#div1{width:200px;margin-right:10px}
#div2{width:760px}

и HTML

<div id="wrapper">
  <div id="div1"><!--here the select goes--></div>
  <div id="div2"><!--here the table goes--></div>
</div>

А вот скриншот того, что происходит после и до:
Скриншот

JavaScript вообще не задействован

Я тестировал с Opera (Presto), Firefox (Gecko), IE8 (Trident) и без проблем, кажется, он появляется только в браузере на основе Webkit, так как я тестировал на Chrome 2, SR Iron и QTWeb

PS: попытайтесь игнорировать уродливый заголовок таблицы, скоро я исправлю это (в настоящее время это нормально в Opera, Firefox, браузере IE8)

Answer 1

В css попробуйте:

#div1{width:200px;margin-right:10px;float:left;}
#div2{width:760px;float:right;}

Надеюсь, это решит проблему с выбором, но поскольку вы используете фиксированные размеры, он все равно сломается, если размер окна будет маленьким.

Answer 2

Если вы хотите настроить таргетинг на браузеры webkit только с помощью css:

@media screen and (-webkit-min-device-pixel-ratio:0)
{    
    "element/class or id here"{
      whatever you need here, ie: padding-top: 24px;
    }    
}