Форум Сайтостроение Веб-строительство

Помогите с css разобраться, проблемы с DIV

R7
На сайте с 18.03.2010
Offline
78
rdk72
582

Вобщем имею примерно следующий код

<div style="float: left;" id="1">

тут выводим несколько картинок, обводим их рамкой при помощи стилей и делаем между ними отступы

</div>

<div id="2">

<div style="padding:2px;background:#fcf8e2;">текст 1</div>

<div style="padding:2px;background:#fff;"> текст 2 </div>

<div style="padding:2px;background:#fcf8e2;"> текст 3</div>

<div style="padding:2px;background:#fff;"> текст 4 </div>

</div>

в результате получаем следующее

Проблема в том, между картинками из первого блока (<div id="1">) появляются полосы (background:#fff;background:#fcf8e2;) из вторго блока (<div id="2">).

На картинке видно что под текстом из первого блока (тут выводим н..) появился розовый фон из второго.

Как сделать так, чтобы в первом блоке не отображались полосы (бэкграунды) из второго?

Извиняюсь, если изложил проблему не внятно, если что спрашивайте. Заранее благодарю за ответ.

[Удален]
#1

ставить между <div id="1"> и <div id="2">: <br style="clear:both;" />

R7
На сайте с 18.03.2010
Offline
78
rdk72
#2
sersky:
ставить между <div id="1"> и <div id="2">: <br style="clear:both;" />

к сожалению не помогло

[Удален]
#3

Пропишите для <div id="2"> - style="clear:both;" , что бы получилось <div style="clear:both;" id="2">.

R7
На сайте с 18.03.2010
Offline
78
rdk72
#4
web21:
Пропишите для <div id="2"> - style="clear:both;" , что бы получилось <div style="clear:both;" id="2">.

и в том и в другом случае идет как бы переход на новый абзац, а мне нужно, чтобы эти 2 блока были на 1 горизонтали

[Удален]
#5

Покажите скрин что у вас там происходит.

[Удален]
#6

Опишите лучше что в итоге получить хотите...

R7
На сайте с 18.03.2010
Offline
78
rdk72
#7
web21:
Опишите лучше что в итоге получить хотите...

все что нужно это чтобы фон из второго дива не налазил на первый див

[Удален]
#8

Вот элементарное решение <div id="2" style="float:right;">

дальше уже решаете вопрос с размерами блоков, или вариант с "резиновой" версткой

<html xmlns='http://www.w3.org/1999/xhtml'>
	<head>
		<meta http-equiv='Content-Type' content='text/html; charset=windows-1251' />
	</head>
	<body>
		<div style="float: left;" id="1">
			тут выводим несколько картинок, обводим их рамкой при помощи стилей и делаем между ними отступы
		</div>
		<div id="2" style="float:right;">
			<div style="padding:2px;background:#fcf8e2;">текст 1</div>
			<div style="padding:2px;background:#fff;"> текст 2 </div>
			<div style="padding:2px;background:#fcf8e2;"> текст 3</div>
			<div style="padding:2px;background:#fff;"> текст 4 </div>
		</div>
	</body>
</html>

Кстати, если размер <div style="float: left;" id="1"> фиксированый, тогда для <div id="2" style="float:left;">

Авторизуйтесь или зарегистрируйтесь, чтобы оставить комментарий