Chciałbym wyrównać elementy blokowe w pływającym pojemniku.

Załóż następujący znacznik.

<div style="float: left;">
  <img style="display: block;" src="...">
  <img style="display: block;" src="...">
</div>

   current                 wanted
+-----------+          +-----------+
|+-------+  |          |  +-------+|
||       |  |          |  |       ||
||       |  |          |  |       ||
|+-------+  |   --->   |  +-------+|
|+----+     |          |     +----+|
||    |     |          |     |    ||
|+----+     |          |     +----+|
+-----------+          +-----------+

Co próbowałem:

div { text-align: right; } - działa w IE8, nie działa w Firefoksie (naturalnie obrazy są blokami i nie powinny mieć na nie wpływu)text-align)img { margin: 0 0 0 auto; } - działa w Firefoksie, nie działa w IE8unoszenie obrazów w prawo - nie działa, ponieważ nigdy nie chcę obrazów w tej samej linii. Ponadto obrazy pływające nie przesuwają dalej następującej treści.

Co jeszcze mogę spróbować? Wolę czyste rozwiązanie CSS, jeśli to w ogóle możliwe.

AKTUALIZACJA

Oto skrzypce, które wyjaśniają pełne oznaczenia:http://jsfiddle.net/Tomalak/yCTHX/3/

Oprawafloat: right; działa dla wszystkich prawdziwych przeglądarek, dla IE8 rozszerza pole obrazu w pierwszym rzędzie na całej szerokości i przesuwa pole z tekstem.