заголовок и картинка на одной странице

[chernikov]

Всем привет.
Есть такой вопрос: как сделать так, чтобы при печати картинка и заголовок выводились на одной странице?
т.е. html код выглядит примерно так:

<p class="header">Image 1</p>
<img src="image1.gif" width="500" height="500" alt="Image 1" />

и при выводе на печать, если это расположено близко к низу печатного листа, то заголовок остается внизу страницы, а сама картинка переносится на новую.
если в css прописать page-break-before:always; то в случае, если на странице много картинок небольшого размера, то каждая получается на новой странице.
Как можно сделать так, чтобы заголовок был всегда с картинкой на одной странице?

[chernikov]

Сейчас переделал код:

<table>
<thead>
<tr>
<td>Figure 1</td>
</tr>
</thead>
<tr>
<td class="enlarge">
<A href="javascript:popWin('730','700','fig=001','win');">(click here to enlarge)</A>
</td>
</tr>
<tr>
<td class="figure">
<A href="javascript:popWin('730','700','fig=001','win');"><img height="464" width="600" alt="Figure 1" src="fig1.gif" /></A>
</td>
</tr>
</table>

Результат тот же. картинка отрывается от содержимомго. Хотя в Рекомендации W3C от 12 мая 1998 г (Каскадные таблицы стилей второго уровня. Спецификация CSS2) Написано: см красным:
Может, просвятит кто-нибудь, в чем тут дело?

13.3.6 "Наилучшие" разрывы страниц
Язык CSS2 не определяет, какой именно разрыв страницы из множества допустимых разрывов должен использоваться; CSS2 не запрещает агентам пользователей вставлять разрывы страниц в любом месте или вообще не использовать их. Но в спецификации CSS2 настоятельно рекомендуется, чтобы агенты пользователей соблюдали следующие эвристические правила (до тех пор, пока не окажется, что они иногда противоречат друг другу):

разрыв страниц должен производиться как можно реже;
все страницы, которые не заканчиваются принудительным разрывом, должны быть примерно одинаковой высоты;
не должно быть разрывов внутри блока, у которого есть граница;
не должно быть разрывов внутри таблицы;
не должно быть разрывов внутри перемещаемого объекта

[Saruman]

chernikov:
если в css прописать page-break-before:always; то в случае, если на странице много картинок небольшого размера, то каждая получается на новой странице.

Прописать для какого элемента? Для img? Укажи это правило для класса header - и оно не будет применяться ко всем картинкам.

chernikov:
Спецификация CSS2) Написано: см красным:
Может, просвятит кто-нибудь, в чем тут дело?

Спецификация - это одно, а реальная реализация в браузерах - совсем и совсем другое, не обязательно ей соответствующее.

[chernikov]

Прописал для класса header.
В первом посте я привел не полный код. Вот полный код:

<p class="header">Image 1</p>
<a href="javascript:popWin('730','700','fig=001','win');">(click here to enlarge)</a><br />
<a href="javascript:popWin('730','700','fig=001','win');"><img height="464" width="600" alt="Figure 1" src="fig1.gif" /></a>

и в css, соответственно:

#content .header {page-break-before:always;}

Так вот при этом варианте получается, что когда на одной странице 5 картинок 100 на 100 пикселей одна под другой, то каждая будет печататься на новой странице. А это совсем не желательно.
В общем, мне нужен такой эффект, который делается в ms word, когда в свойствах абзаца указано: keep with next.