Форум программистов
 

Восстановите пароль или Зарегистрируйтесь на форуме, о проблемах и с заказом рекламы пишите сюда - alarforum@yandex.ru, проверяйте папку спам!

Вернуться   Форум программистов > Web программирование > HTML и CSS
Регистрация

Восстановить пароль
Повторная активизация e-mail

Купить рекламу на форуме - 42 тыс руб за месяц

Ответ
 
Опции темы Поиск в этой теме
Старый 05.10.2018, 11:52   #1
OmegaBerkut
Спокойный псих
Участник клуба
 
Аватар для OmegaBerkut
 
Регистрация: 19.03.2013
Сообщений: 1,538
По умолчанию Запретить "резиновые" размеры блока

Здрасте.
Сегодня при вёрстке обнаружил следующую проблему: размещаю табличные данные в блоке, и когда размеры данных становятся больше нужного размера - родительский контейнер начинает растягиваться ...
Код:
<table class="table_content"> // вёрстка на таблицах, с помесью CSS
	<tr>
		<td class="column_header cell_panel">
			<?php echo $panel_data; ?> // здесь пусть будет что угодно
		</td>
		<td class="column_body cell_body"<?php echo $body_align_params; ?>>
			<div style="overflow:auto;max-width:100%;box-sizing:border-box;"> // здесь что я только не пихал
				<?php echo $info_data; ?> // здесь тоже что угодно
			</div>
		</td>
	</tr>
</table>
Проблема в обозначенном месте подчёркнутый комментарий. Когда размеры внутренних данных становятся слишком большие - родительский контейнер начинает деформироваться ... А мне нужно, что бы родительский контейнер оставался какой нужно изначально, и при overflow появлялись полосы прокрутки в пределах зафиксированного контейнера. Все размеры в процентах.
Дальше CSS
Код:
body,html
{
	width:100%;
	height:98.8%; // подобрал значение, в разных браузерах появляется вертикальная полоса проктутки
	margin:0;
}

.table_content,
.column_header,
.column_body,
.cell_panel,
.cell_body
{
	overflow:auto;
	border-style:solid;
	border-color:#000000;
	border-width:1px;
	border-spacing:0px;
}
.table_content
{
	margin:0.5% 0.5% 0% 0.5%;
	width:99%;
}
.table_content
{
	margin:0% 0.5% 0% 0.5%;
	height:95%; // это главный элемент таблицы, и мне нужно запретить ему менять размеры; остальные 5 % это header и footer
	// здесь много переопределений, так как свойства используются в других таблицах (header и footer)
}
.column_body
{
	background-color:#FFFFFF;
}
.cell_panel
{
	width:20%; // ну это типа панель переходов всё такое =)
}
.cell_body
{
	width:80%;
}
Подпись ? Не, не слышал ...
OmegaBerkut вне форума Ответить с цитированием
Старый 08.10.2018, 10:22   #2
SQLPowerUser
Форумчанин
 
Аватар для SQLPowerUser
 
Регистрация: 19.01.2015
Сообщений: 158
По умолчанию

Попробуйте для самой таблицы задать table-layout fixed
SQLPowerUser вне форума Ответить с цитированием
Старый 08.10.2018, 15:19   #3
OmegaBerkut
Спокойный псих
Участник клуба
 
Аватар для OmegaBerkut
 
Регистрация: 19.03.2013
Сообщений: 1,538
По умолчанию

SQLPowerUser, спасибо, это сработало.

UPD. Представленный вариант в чистом виде нормально работает только на компе, и только в опере. В мозилле и хроме содержимое таблицы всё равно выезжает за пределы экрана (граница при этом остаётся на месте), а на телефоне вообще какая то дичь происходит.
В итоге содержимое таблицы всё равно нужно взять в div
Цитата:
Сообщение от OmegaBerkut Посмотреть сообщение
Код:
<div style="overflow:auto;">
	<?php echo $info_data; ?>
</div>
Подпись ? Не, не слышал ...

Последний раз редактировалось OmegaBerkut; 09.10.2018 в 00:36.
OmegaBerkut вне форума Ответить с цитированием
Старый 10.10.2018, 07:22   #4
OmegaBerkut
Спокойный псих
Участник клуба
 
Аватар для OmegaBerkut
 
Регистрация: 19.03.2013
Сообщений: 1,538
По умолчанию

UPD: огнелис не понимает что такое overflow , так что там у меня теперь высота всего макета начинается с 98.8 % высоты рабочей области браузера, и заканчивается высотой содержимого + мелочи по самому макету ... При этом же, с шириной в лисе всё нормально ...
Подпись ? Не, не слышал ...

Последний раз редактировалось OmegaBerkut; 10.10.2018 в 21:31.
OmegaBerkut вне форума Ответить с цитированием
Ответ


Купить рекламу на форуме - 42 тыс руб за месяц

Опции темы Поиск в этой теме
Поиск в этой теме:

Расширенный поиск


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
Установка блока внизу блока родителя, без использования "relative" Bulat Ibrahim HTML и CSS 21 29.05.2017 23:58
Запретить вырезать ячейки и ставить "." и "/" Ogeris Microsoft Office Excel 3 10.05.2017 11:59
Убрать папки "Pictures", "Music", "Видео", "Downloads" из "МОЙ КОМПЬЮТЕР" Бахтиёр1916 Windows 1 05.04.2017 12:53
Нужно пояснить/прокомментировать код программы, или коды функций "Добавить" "Удалить" "Обновить(редактировать" "Поиск" "Период") ZIRASS PHP 4 15.06.2016 14:23