HTML5 кросс-браузерная проблема;плавающий div и список - PullRequest
Новая
       11

HTML5 кросс-браузерная проблема;плавающий div и список

0 голосов
/ 27 мая 2011 
<!DOCTYPE html>
<html>
<body>
<div style="width:300px; height:300px; 
    background-color: Green; float:left; margin-right:3em;"></div>
<ol>
    <li>First</li>
    <li>Second</li>
</ol>
</body>
</html>

В Chrome 12 и Firefox 4 список отображается справа от зеленого квадрата. В IE9 десятичные цифры смещены влево, перекрывая зеленый квадрат, в то время как содержимое ол находится справа от зеленого квадрата.

Вот скриншот: http://i.stack.imgur.com/EO8Se.png

IE9 с режимом совместимости отображается так же, как Chrome & FF.

  • Какой браузер "правильный"?
  • Можете ли вы предложить разметку, которая отображается как Chrome & FF во всех браузерах?

1 Ответ

1 голос
/ 27 мая 2011

Chrome и firefox верны, хотя это довольно субъективно.

Вы можете попытаться поместить <div> вокруг вашего <ol> и всплыть тоже, что осталось :), или просто попытаться использовать inline-block.

...