.cell p { max-width: 500px; }
.cell img { max-width: 500px; }
Зачем прописывать для каждой?

>>19160
не подходит
затем, что все картинки разного размера

Сделай контейнер, в котором будет текст и картинка. Примерно так:

<div id="wrapper">
<p>Текст который должен переноситься.</p>
<img src="/images/1.png" />
</div>

ИЛИ

Для тега P пропиши:

.cell p {
display:block;
max-width:500px;
}

>>19185
ты не смотришь мой код и не читаешь мой пост

Держи
.cell {width:10px; display:inline-table; margin: 0px; padding: 3px; background-color: #fff; border: 1px #000 solid;}
.cell p {display: table-row; margin: 0px; padding: 0px; background-color: #000; font: 2em Arial; color: #fff;}
.cell img {display: table-row; margin: 0px; padding: 0px;}

>>19195
способность масштабироваться при уменьшении окошка отвалилась
я тоже уже приходил к display: table, только я пробовал для .cell p применить table-caption и обернуть все еще одним дивом, для корректного border'а
и вроде все получилось как надо, но в IE распидорасилось, и еще в чем-то, в FF кажется

впрочем все равно спасибо за попытку

а так, похоже единственное решение - скрипт, который будет подставлять размеры