Как мне предотвратить расширение DIV, чтобы занять всю доступную ширину? ⇐ CSS

[Гость]

В следующем HTML-коде я бы хотел, чтобы рамка вокруг изображения была плотной, а не растягивалась и не занимала всю доступную ширину родительского контейнера. Я знаю, что есть несколько способов сделать это (включая ужасные вещи, например, вручную установить ширину на определенное количество пикселей), но какой правильный способ?

Изменить: В одном из ответов предлагается отключить «display:block», но из-за этого рендеринг будет выглядеть некорректно во всех браузерах, в которых я его тестировал. Есть ли Как получить красивый рендеринг с отключенным параметром «display:block»?

Изменить: Если я добавлю «float: left» в Pictureframe и «clear:both» для тега P, выглядит великолепно. Но я не всегда хочу, чтобы эти кадры перемещались влево. Есть ли более прямой способ выполнить то, что делает «float»?

Код: Выделить всё

.pictureframe {
display: block;
margin: 5px;
padding: 5px;
border: solid brown 2px;
background-color: #ffeecc;
}
#foo {
border: solid blue 2px;
float: left;
}
img {
display: block;
}

Код: Выделить всё

[img]http://stackoverflow.com/favicon.ico[/img]


Why is the beige rectangle so wide?

Источник: https://stackoverflow.com/questions/129 ... able-width