DIV внутри DIV - новая строка в IE7

Question

Очень простой HTML:

<div id="wrapper" style="background-color:green;">WRAP
<div style="float:right;">float2</div>
</div>

Результаты:

• в Chrome, IE8, IE9: слова «WRAP» и «float2» расположены на та же линия; и слова, и вся строка имеют зеленый цвет BG
• только в IE7: слово "WRAP" на 1-й строке и имеет зеленый BG; слово "float2" на второй строке и имеет белый BG

Итак - что я хочу: поведение IE7 == IE8 / 9 / поведение Chrome.

Answer 1

вам просто нужно инвертировать порядок ваших элементов, чтобы IE мог плавать внутренний div перед отображением текста:

<div id="wrapper" style="background-color:green;">
  <div style="float:right;">float2</div>
  WRAP
</div>

Answer 2

попробуйте это:

<div id="wrapper" style="background-color:green;">WRAP<div class="floater" style="float:right;">float2</div></div>

(удалите пробелы и разрывы строк, возможно, это поможет;)