Форум: Форум PHPФорум ApacheФорум Регулярные ВыраженияФорум MySQLHTML+CSS+JavaScriptФорум FlashРазное
Новые темы: 0000000
PHP 5/6. В подлиннике. Авторы: Кузнецов М.В., Симдянов И.В. Самоучитель MySQL 5. Авторы: Кузнецов М.В., Симдянов И.В. PHP на примерах (2 издание). Авторы: Кузнецов М.В., Симдянов И.В. MySQL 5. В подлиннике. Авторы: Кузнецов М.В., Симдянов И.В. Программирование. Ступени успешной карьеры. Авторы: Кузнецов М.В., Симдянов И.В.
ВСЕ НАШИ КНИГИ
Консультационный центр SoftTime

HTML+CSS+JavaScript

Выбрать другой форум

 

Здравствуйте, Посетитель!

вид форума:
Линейный форум Структурный форум

тема: Позиционировать элемент по низу родителя
 
 автор: jangot   (01.10.2008 в 14:03)   письмо автору
 
 

Задача:
Нужно расположить два блока: один спарва другой слева, причем вертикально они должны быть выравненны по низу блока. В смысле, если один блок выше другого, то тот который меньше должен быть внизу.
Нельзя использовать таблици.
В родителе кроме этих блоков ни чего нет.
Как их в строчку расположить понятное дело не проблемма, но как из заставить по низу выравниваться?
Думал сделать абсолютным позиционированием, но как с высотой быть не знаю.
Подскажите плиз решение. Ломаю голову не знаю что делать.

  Ответить  
 
 автор: mihdan   (01.10.2008 в 16:37)   письмо автору
 
   для: jangot   (01.10.2008 в 14:03)
 

Разметку покажите-на словах трудно понять вас

<html>
 <head>
  <title></title>  
  <style>
    div {
        box-sizing: border-box;
        -moz-box-sizing: border-box;
        -webkit-box-sizing: border-box;
    }
    div.parent {
        position: relative;
        height: 600px;
        width: 600px;
        border: 1px solid red;
    }
    div.left {
        position: absolute;
        left: 0px;
        bottom: 0px;
        width: 300px;
        border: 1px solid green;
    }
    div.right {
        position: absolute;
        right: 0px;
        bottom: 0px;
        width: 300px;
        border: 1px solid blue;
    }
  </style>
 </head>

 <body>
  <div class="parent">
        <div class="left">left</div>
        <div class="right">right<br />right<br />right<br />right<br />right<br /></div>
  </div>
 </body>
</html>

  Ответить  
Rambler's Top100
вверх

Rambler's Top100 Яндекс.Метрика Яндекс цитирования