Заставить изображения не переносить - PullRequest
10 голосов
/ 10 июня 2010

Я не могу коснуться HTML-темы, но у меня есть доступ к файлам CSS.

<div class="photos">
    <img src="a.jpg" alt="" align="left" /> 
    <img src="b.jpg" alt="" align="left" />
    <img src="c.jpg" alt="" align="left" />  //align makes the images wrap
</div>

К сожалению, я не могу удалить align = "left" из изображений, иначе этот фрагмент CSS сделал бы эту работу

.photos{
    white-space: nowrap;
}
.photos img{
    display: inline;
    vertical-align: top;
}

Есть идеи? Можно ли вообще выстроить эти изображения по горизонтали, не используя силу таблицы и только с помощью CSS?
Большое спасибо заранее!

Ответы [ 2 ]

19 голосов
/ 10 июня 2010

Попробуйте float: none;:

.photos img{
  display: inline;
  vertical-align: top;
  float: none;
}
1 голос
/ 10 июня 2010

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

.photos img{
    display: inline;
    vertical-align: top;
    clear: both; // clears the floating
}

Подробнее о свойстве CSS clear вы можете узнать в W3Schools .

РЕДАКТИРОВАТЬ
Извините, я неправильно вас понял. Думал, ты пытался сложить их. Вы правы, если выберете float: none или clear: right, которые также сведут на нет число с плавающей точкой. Я бы, вероятно, пошел с обоими, чтобы быть осторожным на некоторых сумасшедших предположениях IE о CSS! ;)

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...