Warning: Cannot use a scalar value as an array in /home/admin/public_html/forum/include/fm.class.php on line 757

Warning: Invalid argument supplied for foreach() in /home/admin/public_html/forum/include/fm.class.php on line 770

Warning: Invalid argument supplied for foreach() in /home/admin/public_html/forum/topic.php on line 737
Форумы портала PHP.SU :: Колонки сайта

 PHP.SU

 Программирование на PHP, MySQL и другие веб-технологии
PHP.SU Портал     На главную страницу форума Главная     Помощь Помощь     Поиск Поиск     Поиск Яндекс Поиск Яндекс     Вакансии  Пользователи Пользователи


 Страниц (1): [1]   

> Без описания
Поиск в теме | Версия для печати
Pavelbeginner
Отправлено: 18 Апреля, 2013 - 16:51:36
Post Id



Частый посетитель


Покинул форум
Сообщений всего: 882
Дата рег-ции: Март 2010  


Помог: 1 раз(а)
Стоит следующая задача: есть три, четеры или любое кол-во колонок на странице. Например, две колонки. Вот код:
CODE (htmlphp):
скопировать код в буфер обмена
  1.  
  2. .col1
  3. {
  4.     float:left;
  5.     width:100px;
  6. }
  7.  
  8. .col2
  9. {
  10.     margin:0 0 0 120px;
  11. }
  12. <div>
  13.      <div class="col1">
  14.        
  15.     </div>
  16.      <div class="col2">
  17.        
  18.     </div>
  19. </div>
  20.  

Все круто, но если внутри col2 встретится очистка потока clear:both, то эта очистка потока опустится вниз на высоту col1. Подскажите, как сделать, чтобы колонки с float-ом(col1 в данном случае) шли в документе после колонки без float-та(col2)? Обязательное условие, чтобы col2 был без float-а, чтобы его ширина тянулась в зависимости от ширины родительского блока.

(Отредактировано автором: 18 Апреля, 2013 - 16:52:03)

 
 Top
DelphinPRO
Отправлено: 18 Апреля, 2013 - 19:06:24
Post Id



Активный участник


Покинул форум
Сообщений всего: 7187
Дата рег-ции: Февр. 2012  


Помог: 353 раз(а)
CODE (css):
скопировать код в буфер обмена
  1. .col2{
  2.   display: table;
  3.   /* or */
  4.   overflow: hidden;
  5.   /* or */
  6.   display: inline-block;
  7. }


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


-----
Чем больше узнаю, тем больше я не знаю.
 
 Top
nkl
Отправлено: 22 Апреля, 2013 - 14:03:15
Post Id



Посетитель


Покинул форум
Сообщений всего: 305
Дата рег-ции: Янв. 2012  


Помог: 1 раз(а)
Цитата:
чтобы его ширина тянулась в зависимости от ширины родительского блока.

Зачем тебе очистка потока clear:both? Можно просто для родительского блока указать overflow:hidden и его высота будет равняться высоте содержимого.
 
 Top
Поиск в теме | Версия для печати
Страниц (1): [1]
Сейчас эту тему просматривают: 0 (гостей: 0, зарегистрированных: 0)
« HTML, Дизайн & CSS »


Все гости форума могут просматривать этот раздел.
Только зарегистрированные пользователи могут создавать новые темы в этом разделе.
Только зарегистрированные пользователи могут отвечать на сообщения в этом разделе.
  



Powered by PHP  Powered By MySQL  Powered by Nginx  Valid CSS  RSS

 
Powered by ExBB FM 1.0 RC1. InvisionExBB