Div верстка

chendger · March 4, 2010

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

А вот что происходит, когда размер монитора меняется.

Подчеркнутые элементы разъезжаются. А мне бы этого не хотелось, но как побороть что-то не пойму.

Играл и тегами position, и с display, и с background attachment - ничего не помогло, наставьте на путь истинный пожалуйста.

Trayanez · March 4, 2010

ну что я тебе могу по этому поводу сказать,....так просто не смогу объяснить в чем косяки!!! надо код смотреть и css! выложи, а там посмотрим!

chendger · March 4, 2010

Архив с index php и css

За любую помощь буду очень признателен!

Edited March 4, 2010 by chendger

Zippovich · March 4, 2010

Сделай общий блок:

<div class="wrapper">...</div>

В котором вся остальная херь, его фиксируй по ширине и центрируй. поставь ему position: relative, что бы внутренние абсолюты относительно его равнялись

Trayanez · March 4, 2010

я долго разбирался в коде.... и примерно понял почему блоки у тебя в ней разъезжаются(расстояние появляется между изображением холодильника и блоком с менюшкой)-это происходит из-за того что (как я понял): основной блок шапки header_wrap у тебя динамический(width:100%), а каждый из трех блоков внутри нее статические по ширине!!!! Рисунок с яблоком наезжает на меню вот из-за этого свойства

DIV.icq1 {

margin-left: 870px;

margin-top: -60px;

font-color: #ffffff;

} то есть рисунок у тебя настраивается от левого края header_wrap....

выход есть один и он для тебя самый приемлимый-сделай сайт статическим по ширине

, и центируй при помощи <center></center>

как и было предложено выше

Int · March 4, 2010

<center></center>

http://www.w3.org/TR/html4/index/elements.html

А вот и нет text-align:center; теперь это называется

chendger · March 4, 2010

Сделал но что-то наверное не так.

Потому что теперь получается искажение при моем разрешении экрана (на скриншоте показано где именно - смещение влево)

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

А на втором скриншоте видно, что при увеличении размеров экрана появляется белое поле в верхнем блоке, и нижний блок сильно смещается.

То что вставил в CSS:

DIV.wprapper {
  position: relative; 
  width: 1024px;
}

Этот div вставил тут в index.php:

<body>

	<div id="accessibility">
		<a href="#nav_main">Skip to Main Menu</a>
		<a href="#content" >Skip to Content.</a>
		<a href="#footer">Skip to Footer</a>
	</div>
<div class="wprapper">
	<div id="icetheme">	</div>  


	<div id="header_wrap">
	<div id="header">

И в самом низу перед </body> закрыл div.

Чувствую что что-то не так записал в CSS, и div вставил не туда в шаблоне, но что именно, и куда не understand.

aTei · March 5, 2010

Как видим, расползается много где.

А исправление верстки потребует не 5 мин и автору еще не по силам.

Предлагаю перенести в Коммерческие Услуги.

rus · March 5, 2010

Проблему можно решить двумя известными способами:

1) Флоатами и марджинами с паддингами.

2) Позиционированием - релативным и абсолютным с указанием так же отступов.

Второй способ труднее, так как я понял что диз. резина, так что пробуйте юзать первый способ.

chendger · March 5, 2010

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

Sign In

Div верстка

Question

chendger

Link to comment

Share on other sites

9 answers to this question

Recommended Posts

Trayanez

Link to comment

Share on other sites

chendger

Link to comment

Share on other sites

Zippovich

Link to comment

Share on other sites

Trayanez

Link to comment

Share on other sites

Int

Link to comment

Share on other sites

chendger

Link to comment

Share on other sites

aTei

Link to comment

Share on other sites

rus

Link to comment

Share on other sites

chendger

Link to comment

Share on other sites

Join the conversation

Обсуждения

Forums

Important Information