Тема: Помогите растянуть DIV на 100% по длине

Ответить в теме
Показано с 1 по 11 из 11
  1. Вверх #1

    По умолчанию Помогите растянуть DIV на 100% по длине

    Вот есть сайтик :
    http://denden.odessalife.com/

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


  2. Вверх #2
    ничего не понял..
    <div style="width: 100%; height: 100%; align: top; position: fixed;"></div>
    это?
    активная подрывная деятельность способствует здоровому сну

  3. Вверх #3
    если было бы все так просто

    Как растнуть пустой DIV по высоте,
    В общем, есть сайт вот такой вот верстки :



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

    вроде все просто, но почему-то на указанном сайте это не выполняется, только если жестко задать все блокам высоту в пикселях.
    Последний раз редактировалось oleg_; 29.12.2009 в 15:35.

  4. Вверх #4
    Новичок
    Пол
    Мужской
    Адрес
    Одесса
    Сообщений
    82
    Репутация
    19
    Вы код м стили этой конструкции покажите для начала.
    А вложенный div если ему задать проценты может не тянуться потому, что браузер не знает относительно чего ему эти проценты считать.
    Проверьте чтобы у родителей этого div была высота определена.

  5. Вверх #5
    <div class="red">
    <div class="green">
    <div class="blue">
    TEXT
    </div>
    </div>
    </div>

    .red
    {
    width: 90%;
    float: top;
    margin-top: 100px;
    background: #FF0000;
    }
    .green
    {
    width: 70%;
    margin-top: 50px;
    margin-bottom: 50px;
    margin-left: 30%;
    background: #00FF00;
    }
    .blue
    {
    width: 40%;
    margin-top: 25px;
    margin-bottom: 25px;
    margin-left: 25px;
    background: #0000FF;
    }

    не проверял, но мне кажется, должно работать.
    активная подрывная деятельность способствует здоровому сну

  6. Вверх #6
    Постоялец форума Аватар для Vintyara
    Пол
    Мужской
    Адрес
    Odessa
    Сообщений
    2,979
    Репутация
    689
    первым делом не забудьте

    html, body {
    height: 100%;
    width: 100%;
    margin: 0;
    padding: 0;
    }
    Давай не будем обманывать друг друга! Ты (да, ты) все равно останешься им!

  7. Вверх #7
    Новичок Аватар для Розарий
    Пол
    Мужской
    Адрес
    таки Одесса
    Возраст
    33
    Сообщений
    1
    Репутация
    10
    Придётся попрощаться с тегом <!DOCTYPE>. Тогда можно растянуть слой до низа страницы. Центрировать по вертикали слой всё равно не сможет, зато с этим прекрасно справляются таблицы

    ___________
    HTML
    -------------
    <html>
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title>Untitled Document</title>
    <style type="text/css">
    body {padding:0; margin:0; font:12pt "Lucida Console", Arial, sans-serif; color:#fff;}
    td {text-align:center; vertical-align:middle;}
    h1 {margin:0;}
    .testTbl, .testDiv {width:100%; height:100%; background:#00f; text-align:center; vertical-align:middle;}
    </style>
    </head>

    <body>
    <!--div class="testDiv"><h1>test</h1></div-->
    <table cellspacing="0" class="testTbl">
    <tr>
    <td><h1>НЛО прилетело и опубликовало эту надпись здесь</h1></td>
    </tr>
    </table>
    </html>
    ___________

  8. Вверх #8
    Новичок
    Пол
    Мужской
    Адрес
    Одесса
    Сообщений
    82
    Репутация
    19
    Цитата Сообщение от Розарий Посмотреть сообщение
    Придётся попрощаться с тегом <!DOCTYPE>.
    А без <!DOCTYPE> как будете совместимость в IE обеспечивать ?
    Да и с другими браузерами тоже.

  9. Вверх #9
    Постоялец форума Аватар для Vintyara
    Пол
    Мужской
    Адрес
    Odessa
    Сообщений
    2,979
    Репутация
    689
    Цитата Сообщение от Розарий Посмотреть сообщение
    Придётся попрощаться с тегом <!DOCTYPE>. Тогда можно ...
    крайне не рекомендуется так прощаться все можно и с ним сделать!
    Давай не будем обманывать друг друга! Ты (да, ты) все равно останешься им!

  10. Вверх #10
    joomla
    гость

    По умолчанию Div

    На моем сайте есть видео уроки по дивам и не толька www.v a s a v a.ru

  11. Вверх #11
    Тут есть принцип, что div (если не указанно его height) будет тянутся при встрече с margin блочного дочернего элемента или собственного padding (которое встретило внутри себя блочный элемент ) но при условии что оба блочных элемента(в данной ситуации div) имеют одинаковые значения float(none|right|left) ... иначе будет "месево" на странице а в IE ваще чудеса
    а по по воду <!DOCTYPE> то можно поставить и 4 html и вроде будет валидно
    Последний раз редактировалось Namare; 13.01.2010 в 13:33.


Ответить в теме

Похожие темы

  1. Ответов: 31
    Последнее сообщение: 01.07.2017, 00:18
  2. DIV или TAB?
    от Мечтающий Тушканчик в разделе Программирование
    Ответов: 2
    Последнее сообщение: 20.11.2005, 22:15
  3. MPIO FG 100
    от marvel в разделе Мобильная техника
    Ответов: 0
    Последнее сообщение: 18.11.2004, 21:24
  4. 100 Gothic [Spb] D'n'B ReMIX
    от Night_Look_Back в разделе Музыка
    Ответов: 1
    Последнее сообщение: 23.10.2004, 15:49
  5. Samsung S 100
    от Vintyara в разделе Мобильная техника
    Ответов: 0
    Последнее сообщение: 14.05.2004, 14:03

Социальные закладки

Социальные закладки

Ваши права

  • Вы не можете создавать новые темы
  • Вы не можете отвечать в темах
  • Вы не можете прикреплять вложения
  • Вы не можете редактировать свои сообщения