Jump to content
  • 0

Высота контейнера со слоями


Detech
 Share

Question

Здравствуйте, подскажите пожалуйста, не могу решить проблемку с высотой контейнера. Описание: у меня в некотором контейнере (таблица) расположено 2 div, пусть будут высотой 500 пикселей для примера. Контейнер при этом принимает высоту в 1000 пикселей. Второй (нижний) div имеет отрицательное смещение по высоте, для того чтобы располагаться в 2 слоях на одном месте с первым. Получаются что оба div расположены в верхней части контейнера в разных слоях, а нижняя часть пустует. Так вот - несмотря на то что нижняя граница обоих div расположена примерно на 500-ом пикселе - граница контейнера(таблицы) не подтягивается туда, а по прежнему занимает старый размер как будто там есть какой то объект. Насколько я понимаю механизм - положение элементов и границы обьектов расчитываются не от реального их положения, а от того где бы они располагались не имея бы смещения.

Собстно вопрос - как заставить таблицу вмещающую в себя 2 divа по 500 пикселей высотой наложенных на друг друга быть тоже высотой в 500 пикселей, а не растягиваться на 1000?

Link to comment
Share on other sites

6 answers to this question

Recommended Posts

  • 0

То есть при использовании абсолютной системы отсчета - объект располагается в контейнере, но его размеры не учитываются при расположении остальных?

upd: При использовании данного варианта у меня divы выползают за контейнер и располагаются непосредственно на сайте, что недопустимо. Есть ли какой либо вариант разместить дивы внутри контейнера без жеского прибивания его к определенному месту экрана и жесткой задачи его размеров? Надо чтобы див принимал размеры (к примеру ширину) контейнера и при смещении контейнера - смещался вместе с ним. То есть возможно ли сделать решение проблемы не применяя абсолютную систему отсчета?

Хотелось бы чтобы структура была масштабируемой, а то эти заплатки в виде абсолютных дивов выглядят уродливо :(

Edited by Detech
Link to comment
Share on other sites

  • 0

b368d16c0b6e.png

Слева любой контейнер (форма, таблица, тело сайта) с 2 дивами - красным и синим. Контейнер плотно обжимает дивы. Справа - синий див поднят вверх для размещения в одном и том же месте что и красный. При этом оба дива в контейнере и принимают его форму. Снизу - образуется пустое место и контейнер отказывается подтягиваться до нижней границы дивов, считая свой размер от совокупности высот дивов(не учитывая их реальное положение).

Можно ли както подтянуть нижнюю границу контейнера чтобы она обжимала дивы плотно? Абсолютное позиционирование - не вариант, так как при этом дивы игнорируют контейнер и все их размеры приходится задавать жеско вне зависимости от резолюции пользователя и размера экрана (контейнера), что как бы противоречит насколько я понимаю всей идее языка разметки.

Окраска дивов - просто для примера, там может быть что угодно, текст, картинка, объект и т.д.

Edited by Detech
Link to comment
Share on other sites

  • 0

а вариант чтобы синий див был в красном, а красный в таблице, или что у вас там, не подходит?

хотя вообще-то и отрицательный маржин должен работать. может какие-то свойства цсс не дают таблице нижний край подтнуть.

действительно ссылка, или код не помешали бы

Edited by Alma
Link to comment
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.
Note: Your post will require moderator approval before it will be visible.

Guest
Answer this question...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

 Share

×
×
  • Create New...

Important Information

We have placed cookies on your device to help make this website better. You can adjust your cookie settings, otherwise we'll assume you're okay to continue. See more about our Guidelines and Privacy Policy