Форум PHP программистов > Высота блока не поддается директивам CSS

[ Поиск ] - [ Пользователи ] - [ Календарь ]

Полная Версия: Высота блока не поддается директивам CSS

Страницы: 1, 2

Владимир55

25.05.2014 - 19:50

Нашел в сети типовой скрипт всплывающей формы и переделал его поля под свои задачи. И все бы хорошо, но не удается задать высоту открытой формы.

Дизайн на сайте резиновый и при узком экране получается полупустая нижняя часть (скриншот), что весьма некрасиво.

Хромовским инспектором кода перебрал практически все, что только можно, но ничего не влияет! Точнее, инспектор показывает какие-то настройки, которые не существуют на самом деле. Или же в Хроме они влияют, но если занести в CSS, то все остается по старому!

Вот такая странность...

Можете взглянуть, что там такое? Вот ссылка.

(Смотрите при ширине экрана меньше 500рх).

P.S. Попугайская раскраска для выделения блоков.

Kopipaster

25.05.2014 - 20:16

<div class="contact-content" style="height: 280px;">//Это не в CSS
<div class="contact-content" style="height: 50%;">//Поправь вот так или вообще убери и задавай в CSS

Владимир55

25.05.2014 - 20:58

Цитата (Kopipaster @ 25.05.2014 - 16:16)

<div class="contact-content" style="height: 50%;">//Поправь вот так

Это я пробовал - не влияет.

Сейчас установил

<div class='contact-content' style='height: 50%;'>

Можете посмотреть результат.

Может быть, не в этом дело?

Владимир55

25.05.2014 - 21:07

Цитата (Kopipaster @ 25.05.2014 - 16:16)

вообще убери и задавай в CSS

Это тоже хорошая идея, но только непонятно, что задавать. Если вот так

background-color:purple; color:#ddd; height: 50%;

то по клику вообще нет окна"

Kopipaster

25.05.2014 - 21:10

Пока что не поменял

Владимир55

25.05.2014 - 21:19

Для теста написал

<div class='contact-content' style='height: 20px;'>

Как видите, результат тот же самый!

Kopipaster

25.05.2014 - 21:27

Цитата (Владимир55 @ 25.05.2014 - 21:19)

Как видите, результат тот же самый!

:D Видимо ты меняешь что то не то
как было 280px так и осталось

<body>
<p style="font-size:1em;">Текст размером 1em </p>
<p style="font-size:100%;">Текст размером 100% </p>
<p style="font-size:200%;">Текст размером 200% </p>
<br>
<div id="Invitation_clic">
<div id="contact-overlay" class="simplemodal-overlay" style="opacity: 0.5; height: 466px; width: 1280px; position: fixed; left: 0px; top: 0px; z-index: 1001;"></div>
<div id="contact-container" class="simplemodal-container" style="position: fixed; z-index: 1002; height: 20px; width: 493px; left: 393.5px; top: 15%;">
<a class="modal-close simplemodal-close" title="Закрыть" href="#">x</a>
<div class="simplemodal-wrap" tabindex="-1" style="height: 100%; outline: 0px none; width: 100%; overflow: visible;">
<div id="simplemodal-data" class="simplemodal-data" style="">
<div class="contact-top"></div>
<div class="contact-content" style="height: 280px;">/--ВОТ ТУТ--/
</div>
</div>
</div>
</body>

Быстрый ответ:

Здесь расположена полная версия этой страницы.