https://www.opennet.dev/openforum/vsluhforumID8/8363.html Доброго дня Уважаемые!<br><br>Клепаю тут страницу, и хочу чтобы не было JS, а надо в частности мне сделать стандартную штуку:<br>&lt;body&gt;<br> &lt;div id="pgHeader"&gt;Тут шапка страницы. Её высота неизвестна&lt;/div&gt;<br> &lt;div id="pgContent"&gt;Тут собственно блок с содержимым. Он должен быть высотой от шапки до подножья, и если содержимое не влазит, то с прокруткой (но только сам блок с прокруткой, а не страница)&lt;/div&gt;<br> &lt;div id="pgFooter"&gt;Это подножье страницы, тоже неясна высота. Этот блок должен быть прикреплен к низу экрана.&lt;/div&gt;<br>&lt;/body&gt; <br><br>Подскажите как это на CSS сделать? Т.е. шапка и подножье всегда должны быть на своих местах соответственно сверху и снизу, а блок содержимого при необходимости скроллиться.<br> https://www.opennet.dev/openforum/vsluhforumID8/8363.html#11 Tue, 13 Feb 2024 16:46:32 GMT &gt; Кажись так <br><br>Спасибо огромное, Уважаемый! <br><br>Именно так получилось. Всё оказалось до неприличия просто<br>[code]<br>&lt;html&gt;<br>&lt;head&gt;&lt;title&gt;test&lt;/title&gt;&lt;/head&gt;<br>&lt;style&gt;<br>body {<br>margin: 0;<br>padding: 0;<br>}<br>#d1 {<br>display: flex;<br>flex-flow: column;<br>background-color: yellow;<br>height: 100vh;<br>width: 50vw;<br>margin: 0 auto;<br>}<br>#d2_1 {<br>background-color: white;<br>}<br>#d2_2 {<br>background-color: blue;<br>height: 99%;<br>overflow-y: scroll;<br>}<br>#d2_3 {<br>background-color: red;<br>}<br>&lt;/style&gt;<br>&lt;body&gt; <br>&lt;div id="d1"&gt;&lt;!-- Общий блок --&gt;<br>&lt;div id="d2_1"&gt;ШАПКА ТУТ&lt;/div&gt;&lt;!-- Шапка --&gt;<br>&lt;div id="d2_2"&gt;Содержимое тут&lt;/div&gt;&lt;!-- Содержимое --&gt;<br>&lt;div id="d2_3"&gt;Подножье тут&lt;/div&gt;&lt;!-- Подножье --&gt;<br>&lt;/div&gt;<br>&lt;/body&gt;<br>&lt;/html&gt; <br>[/code]<br> https://www.opennet.dev/openforum/vsluhforumID8/8363.html#10 Sat, 10 Feb 2024 07:02:59 GMT На stallman.org те самые три блока посмотри.<br> https://www.opennet.dev/openforum/vsluhforumID8/8363.html#9 Fri, 09 Feb 2024 22:53:54 GMT &gt; Доброго дня Уважаемые!<br><br>Решили задачку?<br>Как вариант можно было основной каркас обернуть в див со свойством<br>display: flex;<br>Flex-flow: column;<br>Justify-content: space-between;<br><br>Кажись так<br>А центральному блоку поставить overflow-y: scroll;<br>Но ему скорее всего еще желательно задать св-во height: ...%<br><br>Ну как-то так<br><br><br> https://www.opennet.dev/openforum/vsluhforumID8/8363.html#8 Wed, 15 Nov 2023 14:13:07 GMT &gt; Высота таблицы 100%, <br>&gt; высота заголовка 100px, <br>&gt; высота середины не указана, <br>&gt; высота футера 100px.<br><br>Вы таки настаиваете что футер и заголовок должны быть жестко заданной высоты. Но этого нет в условии. Понимаете, вот к примеру в шапке блок H1 с текстом - типа лого, также контакты всякие написаны. В футере тоже что-то текстом оформлено, откуда там знать какую задавать высоту? Ведь это будет зависеть от разрешения, шрифтов и прочих пользовательских условий.<br><br>Как на форумах любят давать свои условия задач, вместо ответов на вопросы сформулированные вопрошающим. Ужас.<br><br><br> https://www.opennet.dev/openforum/vsluhforumID8/8363.html#7 Wed, 15 Nov 2023 07:33:11 GMT Высота таблицы 100%,<br>высота заголовка 100px,<br>высота середины не указана,<br>высота футера 100px.<br> https://www.opennet.dev/openforum/vsluhforumID8/8363.html#6 Sat, 28 Oct 2023 17:49:51 GMT &gt;[оверквотинг удален]<br>&gt; <br>&gt; height: 110px; <br>&gt; <br>&gt; overflow-x: hidden; <br>&gt; <br>&gt; overflow-y: auto; <br>&gt; <br>&gt; text-align:justify; <br>&gt; <br>&gt; } <br><br>Слушайте, но ведь ясно видно, что данное решение не подходит. В нём подразумевается, что высота div'а известна, она и задаётся в стиле. А я же написал задачу. Что сколько-то вертикали уходит на заголовок, сколько-то на подножье, остальное (неизвестно сколько, зависит от браузера, разрешения у пользователя, от шрифтов и пр.) должно остаться на контент. И в этом соль и есть как отвести ему только оставшееся место на экране. Условия же вопроса вполне однозначно описаны, можно ведь прочитать прежде чем отвечать, и уж тем более прежде чем ворчать не по делу.<br><br> https://www.opennet.dev/openforum/vsluhforumID8/8363.html#5 Fri, 27 Oct 2023 16:28:13 GMT так третий ответ в гугле на "scroll inside div" - https://www.geeksforgeeks.org/making-a-div-vertically-scrollable-using-css/<br>ну вы ч0<br><br> div.scroll {<br> margin:4px, 4px;<br> padding:4px;<br> background-color: green;<br> width: 500px;<br> height: 110px;<br> overflow-x: hidden;<br> overflow-y: auto;<br> text-align:justify;<br> }<br> https://www.opennet.dev/openforum/vsluhforumID8/8363.html#4 Thu, 26 Oct 2023 16:33:55 GMT &gt; Я бы фреймами сделал.<br><br>Ну фреймы вроде как неактуально настолько, что их даже из браузеров то ли подумывают выпиливать, то ли выпилили. Не, фреймы это шибко жоский хардкор.<br> https://www.opennet.dev/openforum/vsluhforumID8/8363.html#3 Thu, 26 Oct 2023 16:06:43 GMT &gt;[оверквотинг удален]<br>&gt; &lt;!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"&gt; <br>&gt; &lt;HTML&gt; <br>&gt; &lt;HEAD&gt; <br>&gt; &lt;/HEAD&gt; <br>&gt; &lt;BODY BGCOLOR="#FFFFFF"&gt; <br>&gt; &lt;TABLE&gt; <br>&gt; &lt;!-- Тут будет верстка --&gt; <br>&gt; &lt;/TABLE&gt; <br>&gt; &lt;/BODY&gt; <br>&gt; &lt;/HTML&gt; <br><br>Спасибо, но можно чуточку более развёрнуто, как сделать чтобы ячейка в среднем из 3-х рядов в таблице не растягивалась под своё содержимое?<br>т.е. какой набор трюков нужен над таблицей<br>&lt;table&gt;<br>&lt;tr&gt;&lt;td&gt;шапка&lt;/td&gt;&lt;/tr&gt;<br>&lt;tr&gt;&lt;td&gt;содержимое + &lt;img style="height:2000px" src="путь_к_большой картинке"&gt;&lt;td&gt;&lt;/tr&gt;<br>&lt;tr&gt;&lt;td&gt;подножье&lt;/td&gt;&lt;/tr&gt;<br>&lt;/table&gt;<br>, чтобы таблица растянулась на экран, шапка верхняя часть, подножье снизу, а содержимое с огромной картинкой в ячейке у которой скролл по вертикали, которым это содержимое и мотается?<br><br>