Вернуться   Дизайнерский форум » ВЕБ-ПРОГРАММИРОВАНИЕ » HTML, CSS, JavaScript

Нужна помощь в выравнивании!

Обсуждение темы Нужна помощь в выравнивании! в разделе HTML, CSS, JavaScript, часть категории ВЕБ-ПРОГРАММИРОВАНИЕ; Всем привет! Который день бъюсь с проблемой выравнивания div`ов после применения к ним свойств float: left; Код: .thumbnail { float: left; width: 60px; ...


Закрытая тема
 
Опции темы
Старый 26.01.2011, 14:16   #1
Всем привет!
Который день бъюсь с проблемой выравнивания div`ов после применения к ним свойств float: left;

Код:
.thumbnail
{
float: left;
width: 60px;
border: 1px solid #999;
margin: 0 15px 15px 0;
padding: 5px;
}

.clearboth { clear: both; }
Код:
<div class="th_cont">

<div class="thumbnail">
<img src="./images/image.gif" alt="" width="60" height="60"><br>
Caption 
</div>
<div class="thumbnail">
<img src="./images/image.gif" alt="" width="60" height="60"><br>
Caption 
</div>
<div class="thumbnail">
<img src="./image.gif" alt="" width="60" height="60"><br>
Caption 
</div>
<br class="clearboth">
<div class="thumbnail">
<img src="./images/image.gif" alt="" width="60" height="60"><br>
Caption 
</div>
<div class="thumbnail">
<img src="./images/image.gif" alt="" width="60" height="60"><br>
Caption 
</div>
<div class="thumbnail">
<img src="./images/image.gif" alt="" width="60" height="60"><br>
Caption 
</div>

Задача выровнять дивы по центру контейнера (th_cont) и (как вариант) растянуть по ширине контейнера (ширина блока не известна).

Последний раз редактировалось cronmix; 26.01.2011 в 14:18..
 
Старый 26.01.2011, 14:16
Ссылки
Старый 26.01.2011, 17:44   #2
"выровнять дивы по центру контейнера (th_cont) и (как вариант) растянуть по ширине контейнера"
если они будут иметь такую же ширину, то зачем им быть по центру?
Сделайте display: inline; - это их в ряд поставит. А по ширине - width: 18%; (получили поделив 100 на 6)
 
Старый 26.01.2011, 18:10   #3
проверить возможности нет, но margin-left:50% результат приносит?
 
Старый 27.01.2011, 09:51   #4
Я перепробывал можноство изветсных мне вариаций. Уже и в таблицу пихал, и в дополнительные контейнеры и уже их пытался отцентрировать - ничгео не помогает.
diplay in line результата не даёт
маригн лефт (райт) то же не действуют

ХЕЛП

Добавлено через 22 минуты

Да, еще момент забыл написать:
Ширина блоков (в прмере 60px) может быть любой "по задумке" дизайнера.
грубо говоря и 100 и 260 px

Последний раз редактировалось cronmix; 27.01.2011 в 09:51.. Причина: Добавлено сообщение
 
Старый 27.01.2011, 10:19   #5
Код HTML:
.th_cont {text-align: center;}
.thumbnail {display: inline-block;}
 
Этот пользователь сказал спасибо Niemans за это полезное сообщение:
cronmix (27.01.2011)
Старый 27.01.2011, 12:07   #6
Оказывается все было намного ближе чем казалось
Огромадное спасибо!

Может кому будет полезен результат!
Код:
.thumbnail
{
display: inline-block;

width: 60px;
border: 1px solid #999;
margin: 0 15px 15px 0;
padding: 5px;
}

.cent_cont
{
  border: 1px #00FF55 dotted;
  text-align: center;
  margin: 0 auto;
}
Тему можно закрывать
 
Старый 27.01.2011, 12:07
Закрытая тема




Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
Нужна помощь с G-pen 560 ivan341 Кальянная 3 08.04.2009 22:20
Нужна помощь по Ssi lagoff HTML, CSS, JavaScript 1 11.12.2006 07:18
Нужна помощь SLIPPER Графические работы 18 05.10.2006 21:20
Нужна помощь! Миран Растровая графика 2 23.12.2004 15:56
Нужна помощь! tend HTML, CSS, JavaScript 2 28.11.2004 23:49


Текущее время: 02:55. Часовой пояс GMT +4.

Реклама на форуме Условия размещения рекламы
Биржа ссылок Заработай на сайте!
Дизайнерский форум