Я знаю о марже авто.Однако, это не работает для меня здесь.
Я пытаюсь центрировать (возможно, длинную) строку текста над (относительно узким) изображением.Если текст длиннее изображения, он должен вылиться из результирующего блока на обоих концах, поэтому весь комплекс имеет такую же ширину, как и изображение.
Разметка выглядит примерно так:
<div class="bb">
<a href="blahblah">
<b>CaptionAbove</b>
<img src="blah.png"/>
</a>
<b>below</b>
</div>
.bb
- это встроенный блок, поэтому эти ББ выскакивают по горизонтали в ряд.CaptionAbove может быть длиннее, чем img, но не должен растягивать соседей!элементы a и b являются display: block, так что все внутри здесь складывается вертикально.
Если я задаю заданную ширину, например 1em, чтобы он не увеличивался, чтобы окружить текст, то переполнениетекст находится только справа, а искусственный прямоугольник находится на одном уровне внутри включенного блока .
Мне нравится разметка, объединяющая img и заголовок вместе, и таблица не только потеряет это, ноэффекты наведения мыши, зная, что вертикальный стек - это один элемент.
Любые предложения приветствуются.