"резиновая" галерея фоток

archizona · 23.05.2012, 13:51

Есть последвательность превьюшек картинок на "тянущемся" DIV
когда DIV растягивается превьюшки перескакивают наверх. Но так как они "лепятся" левым краем получается довольно большое и некрасивое поле справа. Получается такая некрасивость http://archizona.ru/tanu4.html
Мне нужно сделать так, чтобы слева и справа от превьюшек были одинаковые поля (пусть меняющиеся, но одинаковые)

Код HTML:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
<style type="text/css">
#fdads {
	height: 900px;
	width: auto;
	margin-right: 10%;
	margin-left: 10%;
	background-color: #309;
}
#images {
	height: 90px;
	width: 120px;
	background-color: #CF0;
	float: left;
}
</style>
</head>

<body>
<div id="fdads">
 <div id="images">Content for  id "images" Goes Here</div>
   <div id="images">Content for  id "images" Goes Here</div>
    <div id="images">Content for  id "images" Goes Here</div>
     <div id="images">Content for  id "images" Goes Here</div>
      <div id="images">Content for  id "images" Goes Here</div>
       <div id="images">Content for  id "images" Goes Here</div>
        <div id="images">Content for  id "images" Goes Here</div>
         <div id="images">Content for  id "images" Goes Here</div>
          <div id="images">Content for  id "images" Goes Here</div>
           <div id="images">Content for  id "images" Goes Here</div>
            <div id="images">Content for  id "images" Goes Here</div>
</div>
</body>
</html>

Это мой личный единственный сайт, который с табличной верстки решила переделать на DIV. Хочется сделать его красивым.

Добавлено через 5 часов 20 минут

решилось так

Код HTML:

#images {
	
	
	
	width: 120px;
	background-color: #0CC;
	vertical-align: top;
	display: inline-block;
	min-height: 90px;

}

код взяла с другого сайта

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

только в ie7, 8 отображается криво....

maxefect · 23.05.2012, 14:56

Я сижу на maxton3 (там можно + переключить на IE7) / так вот я посмотрел .... у меня при клике на изображении и выводе его в модальном окне! Изображение располагается за содержанием (некоторая часть), также и в IE

Решите этот вопрос (там всего то надо в JS дописать отступ от левого края) и все проблем я больше не заметил

Niemans · 24.05.2012, 11:30

а что такое li2?

Похожие темы
Тема	Автор	Раздел	Ответов	Последнее сообщение
Нужно определить фильтр "ГРЯЗНЫХ" фоток	damuzicc	Фотография	4	06.04.2007 17:28
"Оцените, господа!" или "Когда клиент через год переоценивает взгляды"	()@ZI$	Зал дебютантов	15	30.11.2005 09:50
Продажа билетов лотерей "Золотой ключ", "Русское Лото", "ТВ Бинго-шоу"	Florid	Кальянная	1	22.08.2005 19:24
Css, слои, "резиновая" верстка	mr_jok	HTML, CSS, JavaScript	4	27.01.2005 18:57
Очень бы хотелось услышать советы "бывалых" и "знающих"	tim	Зал дебютантов	10	10.05.2004 09:48

23.05.2012, 13:51	#1
archizona	Есть последвательность превьюшек картинок на "тянущемся" DIV когда DIV растягивается превьюшки перескакивают наверх. Но так как они "лепятся" левым краем получается довольно большое и некрасивое поле справа. Получается такая некрасивость http://archizona.ru/tanu4.html Мне нужно сделать так, чтобы слева и справа от превьюшек были одинаковые поля (пусть меняющиеся, но одинаковые) Код HTML: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>Untitled Document</title> <style type="text/css"> #fdads { height: 900px; width: auto; margin-right: 10%; margin-left: 10%; background-color: #309; } #images { height: 90px; width: 120px; background-color: #CF0; float: left; } </style> </head> <body> <div id="fdads"> <div id="images">Content for id "images" Goes Here</div> <div id="images">Content for id "images" Goes Here</div> <div id="images">Content for id "images" Goes Here</div> <div id="images">Content for id "images" Goes Here</div> <div id="images">Content for id "images" Goes Here</div> <div id="images">Content for id "images" Goes Here</div> <div id="images">Content for id "images" Goes Here</div> <div id="images">Content for id "images" Goes Here</div> <div id="images">Content for id "images" Goes Here</div> <div id="images">Content for id "images" Goes Here</div> <div id="images">Content for id "images" Goes Here</div> </div> </body> </html> Это мой личный единственный сайт, который с табличной верстки решила переделать на DIV. Хочется сделать его красивым. Добавлено через 5 часов 20 минут решилось так Код HTML: #images { width: 120px; background-color: #0CC; vertical-align: top; display: inline-block; min-height: 90px; } код взяла с другого сайта Добавлено через 22 часа 29 минут только в ie7, 8 отображается криво.... Последний раз редактировалось archizona; 23.05.2012 в 13:51.. Причина: Добавлено сообщение

23.05.2012, 14:56	#2
maxefect	Я сижу на maxton3 (там можно + переключить на IE7) / так вот я посмотрел .... у меня при клике на изображении и выводе его в модальном окне! Изображение располагается за содержанием (некоторая часть), также и в IE Решите этот вопрос (там всего то надо в JS дописать отступ от левого края) и все проблем я больше не заметил

24.05.2012, 11:30	#3
Niemans	а что такое li2?