Помогите сверстать . Проблема с margin auto и z index
http://uaimages.com/viewer.php?id=617130fon-menu.jpg
как видите на картинке есть основной див как фон, в нем будут изображения которые могут быть больше разрешения экрана, поэтому их нужно центровать. Над этим дивом еще один и тоже отцентровать Ниже обоих еще пару дивов с центровко. Что уже не пробовал. То по центру , то не прокручивается в низ, то прокручивается вниз , то появляется слайдер влево вправо, чего быть не должно. ПС. Самый главный вопрос как отцентрировать див и его содержимое если используется z index & position : absolut, reletive/ и еще как отцентрировать большое изображение по центру дива так , чтобы див занимал 100% раочего окна , а изображение выходящее за границы не создавала полосу прокрутки? Если Вы думаете что так, то нет. overflow:hidden Спасибо за помощь. |
0931454574, если хочешь бесплатной помощи - начинай делать тестовый пример...
Либо объявляй цену за работу. :) |
ksa, ты как всегда в своем духе=)))
|
0931454574, забыл дописать
Мой телефон: 0931454574 (звоните договоримся) |
Вот что есть сейчас. Позиционирование
<html>
<head>
<title></title>
<style type="text/css">
<!--
.blockZ0 {
position: relative;
z-index: 0;
top: 0;
width: 100%;
height: 50px;
background: yellow;
text-align: center;
overflow:hidden;
}
.blockZ1 {
position: relative;
z-index: 1;
top: 0;
width: 100%;
height: 400px;
background: yellow;
text-align: center;
overflow:hidden;
}
.blockZ2 {
position: absolute;
z-index: 2;
top: 130px;
left: 100px;
width: 200px;
height: 50px;
background: red;
text-align: center;
}
.blockZ3 {
position: absolute;
z-index: 3;
top: 260px;
left: 820px;
width: 200px;
height: 50px;
background: blue;
text-align: center;
}
.blockZ4 {
position: relative;
z-index:4;
top: 10px;
width: 100%;
height: 550px;
background: yellow;
text-align: center;
}
-->
</style>
</head>
<body>
<div class="blockZ0">z-index 0</div>
<div class="blockZ1"><p><img src="images/homepage_camaro_conv.jpg" width="1900" height="400"></p></div>
<div class="blockZ2">z-index 2</div>
<div class="blockZ3">z-index 3</div>
<div class="blockZ4">z-index 4</div>
</body>
</html>
А вот как можете видеть если вставите свое изображение, оно не центрируется ка ки все остальное, и даже если вставить доп. див то ничего не меняется. |
Ребята, если Вам нечего ответить , не пишите, советы оставьте друзьям и командуйте своей перхотью.
|
нашел решение на вопрос с центровкой изоражения превышающего размеры окна.
Ответ следующий. Берем div с z-index и в него загоняем уже див с фоном, а фон наше изображение, в коде это выглядит так: <div style="width:100%;margin:0px auto;background:url(images/homepage_model_year_wrap_up.jpg);background-position:center; height:400px;"></div> это вставлять сюда <div class="blockZ1"><p><img src="images/homepage_camaro_conv.jpg" width="1900" height="400"></p></div> вместо <p><img src="images/homepage_camaro_conv.jpg" width="1900" height="400"></p> Есть у кого более изящные решения? |
Все получилось, если у кого есть интерес увидеть верстку дивов как на картинке в первом моем сообщении просто напишите слово "ДА" и я выложу здесь, это что бы не захломать форум никому не нужны "Г"(по мнению некоторых товарищей).
|
Ладно, думаете зачем мне эта фигня, я Вам покажу какое практическое приминение имеет данная верстка, завтра утром полцчите ссылку, а если и это будет не интерессно, я признаю свое невежество и займуся вязанием, наверно.
|
http://javascript.ru/forum/showthrea...128#post120128
Заходите и смотрите для чего надо то и то. Думаю это достойное применение! |
| Часовой пояс GMT +3, время: 21:31. |