ReSQL.ru
     
powered by simpleCommunicator - 2.0.61     © 2026 Programmizd 02
Мобильная версия    Контакт    Правила    FAQ    Помощь
Целевая тема:
Создать новую тему:
Автор:
Закрыть
Цитировать
Доб. в избранное | Игнор. тему | Прикреп. тему | Пометить прочит. / непрочит. | Фильтр
Форумы / HTML, JavaScript, VBScript, CSS [игнор отключен] [закрыт для гостей] / [CSS] Динамическая высота DIV'а
16 сообщений из 16, страница 1 из 1
[CSS] Динамическая высота DIV'а
    #35353788
SweetApple
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
SweetApple
Гость
Подскажите, пожалуйста, как сделать, чтобы высота div'а была динамической, т.е. кратной определённому числу? В моём случае, в div'е может раполагаться различной длины текст, мне необходимо, чтобы значение высоты было кратно 42px (т.е в зависимости от длины расположенного в нём текста, высота div'а была или 42px или 84px или 126px и т.д.).
...
Рейтинг: 0 / 0
04.06.2008, 12:50
| Ответить | Цитировать | Написать  
[CSS] Динамическая высота DIV'а
    #35353878
Фотография krvsa
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
krvsa
Участник
Одно дело "динамически увеличиваться"... Другое дело увеличиваться "скачками". я по кратности примеров не встречал...

А чем вызвана потребность в "кратном" увеличении?
----------
Cache for Windows (x86-32) 2007.1.3 (Build 607) Wed Oct 17 2007 02:12:09 EDT
...
Рейтинг: 0 / 0
04.06.2008, 13:11
| Ответить | Цитировать | Написать  
[CSS] Динамическая высота DIV'а
    #35354005
SweetApple
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
SweetApple
Гость
Вот сайт: http://kubik.yeslab.ru/
Левое меню выполнено в виде цветных блоков. В правой части - серые блоки (это и есть div'ы). Необходимо, что нижняя граница любого серого блока совпадала с нижней границей какого-нибудь цветного блока слева. Я рассчитала (пока ещё только примерно), что если высота серого блока будет кратна 42px (42px - суммарная высота цветной и белой полоски слева), то границы будут совпадать.
Если кто-нибудь сможет предложить иной способ реализации данной идеи, я внимательно слушаю :)
...
Рейтинг: 0 / 0
04.06.2008, 13:41
| Ответить | Цитировать | Написать  
[CSS] Динамическая высота DIV'а
    #35354190
Фотография krvsa
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
krvsa
Участник
SweetAppleНеобходимо, что нижняя граница любого серого блока совпадала с нижней границей какого-нибудь цветного блока слева.
А высота серого блока произвольная? Их количество тоже произвольное?
...
Рейтинг: 0 / 0
04.06.2008, 14:39
| Ответить | Цитировать | Написать  
[CSS] Динамическая высота DIV'а
    #35354219
Фотография krvsa
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
krvsa
Участник
Сейчас у тебя серые идут с одинаковым отступом друг от друга... А иначе так не получится - расстояние между ними будет разное...

Кто код-то писал? Очень трудно смотреть...
----------
Cache for Windows (x86-32) 2007.1.3 (Build 607) Wed Oct 17 2007 02:12:09 EDT
...
Рейтинг: 0 / 0
04.06.2008, 14:49
| Ответить | Цитировать | Написать  
[CSS] Динамическая высота DIV'а
    #35354272
Фотография illion
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
illion
Участник
кратное увеличение высоты - разве только что с помощью js. Типа такого:
Код: plaintext
1.
2.
3.
4.
5.
6.
7.
8.
9.
10.
11.
12.
<script>
window.onload = window.onresize = function()
{
	var cont = document.getElementById('container');
	var text = document.getElementById('text');
	cont.style.height = Math.ceil(text.offsetHeight/ 100 )* 100  + 'px';
}
</script>
<div id="container" style="background:gray">
	<div id="text">
		текст 
	</div>
</div>
Но верстка, основывающаяся на скриптах, - не самое удачное решение. Хотя бы даже потому, что ресайз разные браузеры обрабатываю по-разному (ие ведет обработку уже во время ресайза, а фф - постфактум). Лучше уж оставить как есть.

P.S. О меню. Белые буквы меню на пастельно-белесых фонах нечитаемы абсолютно . Цвета должны быть более контрастные. Это относится и к просто тексту - он тоже светловат.
...
Рейтинг: 0 / 0
04.06.2008, 15:03
| Ответить | Цитировать | Написать  
[CSS] Динамическая высота DIV'а
    #35354424
Фотография krvsa
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
krvsa
Участник
Если страничка выводится динамически (формируется скриптом - php, csp) можно расчитать количество строк в диве и поставить ширину принудительно
Код: plaintext
1.
2.
3.
4.
5.
6.
...
s text="какой-то текст"
s height=$$Height^sys(text)
&html<<div style='height:#(height)#;'>>
&html<   <p>#(text)#</p>>
&html<</div>>
...
----------
Cache for Windows (x86-32) 2007.1.3 (Build 607) Wed Oct 17 2007 02:12:09 EDT
...
Рейтинг: 0 / 0
04.06.2008, 15:57
| Ответить | Цитировать | Написать  
[CSS] Динамическая высота DIV'а
    #35354494
Фотография illion
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
illion
Участник
krvsaЕсли страничка выводится динамически (формируется скриптом - php, csp) можно расчитать количество строк в диве и поставить ширину принудительно

эт только если див будет иметь фиксированную ширину. Иначе при изменении размера страницы возможны разнообразные (в зависимости от браузера) последствия. А вообще - ни к чему это все.
...
Рейтинг: 0 / 0
04.06.2008, 16:16
| Ответить | Цитировать | Написать  
[CSS] Динамическая высота DIV'а
    #35355196
ShSerge
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
ShSerge
Участник
SweetApple...было кратно 42px...
Бред какой-то. Зачем?
...
Рейтинг: 0 / 0
04.06.2008, 21:44
| Ответить | Цитировать | Написать  
[CSS] Динамическая высота DIV'а
    #35355200
SweetApple
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
SweetApple
Гость
Код написан не мной. Сайт на Joomla. Моя задача - сверстать шаблон по готовому макету дизайна. (цвет блоков, текста и пр. придумано дизайнером, т.е. ко мне никакого отношения не имеет). Соответствие границ серых блоков и блоков левого меню - требование заказчика. Количество серых блоков - произвольное.
Попробую реализовать с помощью JS, отпишусь, получится или нет.
...
Рейтинг: 0 / 0
04.06.2008, 21:51
| Ответить | Цитировать | Написать  
[CSS] Динамическая высота DIV'а
    #35355214
ShSerge
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
ShSerge
Участник
Ну так illion уже написала. Так должно работать. В некоторых случаях вместо offsetHeight можно попробовать clientHeight. Только это как-то не комильфо.
...
Рейтинг: 0 / 0
04.06.2008, 22:01
| Ответить | Цитировать | Написать  
[CSS] Динамическая высота DIV'а
    #35355371
Фотография illion
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
illion
Участник
SweetApple(цвет блоков, текста и пр. придумано дизайнером, т.е. ко мне никакого отношения не имеет). Соответствие границ серых блоков и блоков левого меню - требование заказчика. Количество серых блоков - произвольное.
Попробую реализовать с помощью JS, отпишусь, получится или нет.
на js. И когда юзер будет менять размер страницы, дивы будут скакать от одного уровня к другому. Ваще отлично. Сайт с нечитаемым меню и прыгающим текстом. Имхо такое можно сразу в мусорку (без обид. Юзабилити стартовой страницы стремится к нулю). Хотя если это требование заказчика, и он им гордится, и оно оговорено где-то на бумаге (в ТЗ), то почему бы и нет. Получай фашист гранату!
...
Рейтинг: 0 / 0
05.06.2008, 00:26
| Ответить | Цитировать | Написать  
[CSS] Динамическая высота DIV'а
    #35355570
Фотография krvsa
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
krvsa
Участник
illionэт только если див будет иметь фиксированную ширину.
Ясное дело. Но у авторши именно такой случай...
...
Рейтинг: 0 / 0
05.06.2008, 08:12
| Ответить | Цитировать | Написать  
[CSS] Динамическая высота DIV'а
    #35355605
Фотография illion
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
illion
Участник
krvsa illionэт только если див будет иметь фиксированную ширину.
Ясное дело. Но у авторши именно такой случай...
ааа... Зашла на сайт. Ну хоть текст при ресайзе прыгать не будет, уже легче.
...
Рейтинг: 0 / 0
05.06.2008, 08:57
| Ответить | Цитировать | Написать  
[CSS] Динамическая высота DIV'а
    #35357932
mrJust
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
mrJust
Гость
>>SweetApple

предлогаю такие решения:
1. Использовать предопределенную высоту для всех блоков справа, кратную 44.
от этой величины отнять размер белого отступа под пунктоми слева (там наверное 22px)
например так:
Код: plaintext
1.
2.
3.
...css: 
.gray-box{background-color:gray;}
.gray-box.fixed{height:( 6 * 44 - 22 )px; margin-bottom:22px; overflow:hidden;}
<div class="gray-box fixed">Fixed gray box</div>

2. Использовать фиксированную высоту только для тех блоков, которые находятся на уровне меню. Можно думать, что для тех серых блоков, что находятся ниже левого меню, ширина не имеет значения.
Код: plaintext
1.
2.
3.
4.
<div class=gray-box fixed>блок на уровне меню</div>
<div class=gray-box fixed>блок на уровне меню</div>
... типа меню кончилось...
<div class=gray-box>блок под меню</div>
можно извратиться еще сильнее и сделать так:
Код: plaintext
1.
2.
3.
4.
5.
6.
.gray-box.fixed- 5 {height:( 5 * 44 - 22 )px; margin-bottom:22px; overflow:hidden;}
.gray-box.fixed- 2 {height:( 2 * 44 - 22 )px; margin-bottom:22px; overflow:hidden;}
<div class=gray-box fixed- 5 >блок на уровне меню</div>
<div class=gray-box fixed- 2 >блок на уровне меню</div>
... типа меню кончилось...
<div class=gray-box>блок под меню</div>
хреново то, что используя этот подход, Вы зависите от контента

3. если интересует только ИЕ, можно использовать expression , немного погуглив написать его не проблема

Но самый идеальный вариант, отказаться от всего этого бреда
...
Рейтинг: 0 / 0
05.06.2008, 21:08
| Ответить | Цитировать | Написать  
[CSS] Динамическая высота DIV'а
    #35358398
Фотография krvsa
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
krvsa
Участник
mrJustНо самый идеальный вариант, отказаться от всего этого бреда

Эти дизайнеры такие затейники!
...
Рейтинг: 0 / 0
06.06.2008, 09:39
| Ответить | Цитировать | Написать  
16 сообщений из 16, страница 1 из 1
Форумы / HTML, JavaScript, VBScript, CSS [игнор отключен] [закрыт для гостей] / [CSS] Динамическая высота DIV'а
Найденые пользователи ...
Разблокировать пользователей ...
Читали тему (0):
Читали форум (0):
Пользователи онлайн (0):
Польз. соглашение   Полит. конфиден.  
NoSQL.ru       Кролег: Проекты, Новости, Чат       РЕД ФОРУМ       Фотоальбом: Участники, Встречи
Закрыть
start [/forum/topic.php?fid=22&fpage=332&tid=1456391]:
 0ms
get settings:
 10ms
get forum list:
 22ms
check forum access:
 4ms
check topic access:
 4ms
track hit:
 69ms
get topic data:
 10ms
get forum data:
 2ms
get page messages:
 53ms
get tp. blocked users:
 1ms
others: 214ms
total:  389ms
созд. / загр.: 389ms
x
x
Закрыть


Просмотр
0 / 0
Close
Debug Console [Select Text]