Выровнять текст справа от изображения && текст не обтекает изображение Должно выглядеть так: [img] text text text text Как это достигается? Кажется прямым, но я борюсь. Ответ 1 Вы можете использовать display:inline-block; img{ display:inline-block; width:75px; height:100px; border:1px solid red; vertical-align:top; margin-right:10px; } div{ display:inline-block; width:200px; } Пример: http://jsfiddle.net/jasongennaro/SK9ad/ Чтобы сделать inline-block; работу с IE7, добавьте следующее к каждому правилу: zoom: 1; *display:inline; Ответ 2 Поскольку вы знаете размеры изображения: HTML: <div style="position: relative;"> <img id="theimg" ... /> <div id="besidetheimg"> </div> </div> CSS #theimg{ position: absolute; top: 50%; margin-top: -50px; // Half the width of the image width: 100px; height: 100px; } #besidetheimg{ margin-left: 100px; // width of image } Это немного странный способ сделать это. Я не уверен, есть ли лучший способ, но он работает: http://jsfiddle.net/dvLqC/
Ответ 1 Вы можете использовать display:inline-block; img{ display:inline-block; width:75px; height:100px; border:1px solid red; vertical-align:top; margin-right:10px; } div{ display:inline-block; width:200px; } Пример: http://jsfiddle.net/jasongennaro/SK9ad/ Чтобы сделать inline-block; работу с IE7, добавьте следующее к каждому правилу: zoom: 1; *display:inline;
Ответ 2 Поскольку вы знаете размеры изображения: HTML: <div style="position: relative;"> <img id="theimg" ... /> <div id="besidetheimg"> </div> </div> CSS #theimg{ position: absolute; top: 50%; margin-top: -50px; // Half the width of the image width: 100px; height: 100px; } #besidetheimg{ margin-left: 100px; // width of image } Это немного странный способ сделать это. Я не уверен, есть ли лучший способ, но он работает: http://jsfiddle.net/dvLqC/