Position relative + absolute и высота блока

Тема в разделе "Верстка", создана пользователем NoName013, 9 фев 2014.

Информация :
Уважаемые пользователи, прежде чем ответить в теме или создать новую, внимательно ознакомьтесь с Правилами раздела и Правилами форума
Для быстрого поиска ответов на ваши вопросы воспользуйтесь Картой раздела и/или Поиском по разделу
Модераторы: ultra
  1. NoName013

    NoName013 Постоялец

    Регистр.:
    10 ноя 2013
    Сообщения:
    80
    Симпатии:
    18
    <div style="position:relative;">
    <div style="position:absolute;">TEXT</div>
    </div>

    Как в такой связке блоков задать высоту блока с position:relativе? Чтобы он растягивался на по содержимому блока position:absolute;?
     
  2. Prostobv

    Prostobv Создатель

    Регистр.:
    4 дек 2013
    Сообщения:
    20
    Симпатии:
    8
    в такой связке не получиться.. если только скриптами растягивать
     
    NoName013 нравится это.
  3. NoName013

    NoName013 Постоялец

    Регистр.:
    10 ноя 2013
    Сообщения:
    80
    Симпатии:
    18
    Тогда придется другим путем пойти...

    Может подскажите, как сделать.
    Нужно расположить блоки col1, col2, col3 в один ряд. Ширина блоков col1 и col3 статичная, а блок col2 должен растягиваться на всю оставшуюся ширину. И это надо сделать без использования float.

    <div id="main">
    <div id="col1"></div>
    <div id="col2"></div>
    <div id="col3"></div>
    </div>
     
  4. max1235

    max1235 Создатель

    Регистр.:
    28 дек 2013
    Сообщения:
    15
    Симпатии:
    0
    Конечно фиг знает почему float не устраивает, по мне так это идеальное решение, задаём фиксированную ширину у 1 и 3 колонок у 1-ого float: left; у 3-го float:ridht; а 2-ой оставляем? ну вообщем вот так
    Код:
    <div id="main">
    <div id="col1" style="float: left; width: 200px; border: 1px solid">1</div>
    <div id="col3" style="float: right; width: 200px; border: 1px solid">3</div>
    <div id="col2" style="width: 100%; border: 1px solid">2</div>
    </div>
     
  5. aaliseyko

    aaliseyko Создатель

    Регистр.:
    17 ноя 2011
    Сообщения:
    17
    Симпатии:
    6
    Код:
    #main {
    letter-spacing: -0.31em;
    word-spacing: -0.43em;
    }
    
    col1,2,3{
    display: inline-block;
    letter-spacing: normal;
    word-spacing: normal;
    }
    
    *+html col1,2,3 {
    display: inline;
    zoom:1;
    }
    
    col1 {
    width: xxx;
    }
    
    col3 {
    width: zzz;
    }
    
     
    NoName013 нравится это.
  6. seraph22

    seraph22 Создатель

    Регистр.:
    23 мар 2012
    Сообщения:
    22
    Симпатии:
    14
    float хорошо использовать, если нужна поддержка старых браузеров типа IE 6, 7 ну и, конечно, само обтекание элементов, но для более точного горизонтального позиционирования и вертикального выравнивания блоков целесообразнее использовать display: inline-block;
     
    NoName013 нравится это.