для Internet Explorer.
ти, я пытаюсь создать версию элемента figure (готовится к выпуску в HTML5), в результате чего у меня есть изображение с кратким описанием под ним.
Однако я хочу ограничить ширину всего этого элемента шириной изображения, чтобы текст был не шире, чем изображение (если необходимо, перенесите его на несколько строк).
Базовый HTML:
<div class="figure">
<img src="..." alt="..." width="..." height="..." /><br />
A description for the image
</div>
Я хорошо разбираюсь в CSS, но не могу придумать ни одного чистого решения CSS, не добавивstyle="width:100px"
кdiv
чтобы соответствовать ширине изображения.
ОбновитьПосле небольшого поиска и обдумывания лучший метод, похоже, использует встроенную ширину в div. Я сохраню атрибут width на изображении, на случай, если я хочу, чтобы div был немного шире, чем изображение (например, чтобы разместить более длинный заголовок).
Этот подход также означает, что у меня может быть два изображения рядом с подписью ниже. Если у меня есть набор изображений одинакового размера, я, конечно, могу добавить дополнительный стиль к каждомуdiv
.
Спасибо всем, кто ответил!