ребята, можете подсказать, зашёл в тупик...
сверху абсолютный див 155px
под ним relative div поднятый на 65 пикселей.
в Опере этот поднятый на 65 пикселей див отображается Поверх абсолютного, а в ФФ наоборот задал z-index'ы - не помогает ((
Вид для печати
ребята, можете подсказать, зашёл в тупик...
сверху абсолютный див 155px
под ним relative div поднятый на 65 пикселей.
в Опере этот поднятый на 65 пикселей див отображается Поверх абсолютного, а в ФФ наоборот задал z-index'ы - не помогает ((
Совет:
Не надо лишний раз двигать relative-элементы без острой на то необходимости)
Извиняюсь, можете перефразировать? [Only registered and activated users can see links. Click Here To Register...]
Без острой на то необходимости не надо лишний раз двигать relative-элементы.
ВЫ издеваетесь [Only registered and activated users can see links. Click Here To Register...]
я имел ввиду, можете по-другому написать? А то я не могу понять, что вы хотели этим сказать... [Only registered and activated users can see links. Click Here To Register...]
всё не так просто...
задача такая:
есть макет (из 5-ти колонок), развернут на 100% по высоте.
есть шапка (155px).
в 3-ей колонке идёт текст, который должен начинатся , скажем с самого вверха, а вверху, то у нас шапка! текст-то начинается сверху, но его шапка закрывает. И это только в ФФ! Вопрос: как заставить 3-юю колонку быть поверх шапки, но в тоже время чтобы шапка была поверх макета?
короче кодом типа так (3-мя колонками):
<div id="wapka"></div>
<div id="center">
<div id="left"></div>
<div id="right"></div>
</div>
колонка right допустим налазит на шапку.
Aykroyd, на конец-то понял, что ты мне хотел сказать!! Боже сколько времени прошло... Надо было сразу написать, что :
объекты могут быт поверх других только тогда когда они находятся на одном уровне, в одном и том же слое [Only registered and activated users can see links. Click Here To Register...]
[/quote]Цитата:
Originally posted by maza@Sep 10 2007, 17:11
объекты могут быт поверх других только тогда когда они находятся на одном уровне, в одном и том же слое* [Only registered and activated users can see links. Click Here To Register...]
<div align='right'>[Only registered and activated users can see links. Click Here To Register...]
Бред)
Вообще, совершенно непонятно что Вы подразумеваете под "слоями"...)
Объясните мне пожалуйста!
То , что хотел сказать, скажу кодом:
Код:<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<meta http-equiv="Content-Language" content="ru">
<meta http-equiv="Content-Type" content="text/html; charset=windows-1251">
<title>СЦУКО</title>
<style type="text/css">
#odin {
height: 100%;
background-color: #eee;
}
#dva {
top: 0;
left: 0;
position: absolute;
background-color: #000080;
color: white;
height: 155px;
width: 100%;
z-index: 2;
}
#tri {
position: relative;
background-color: #880000;
color: white;
height: 600px;
width: 100%;
z-index: 1;
}
#tritri {
position: relative;
background-color: #808008;
color: white;
height: 300px;
width: 200px;
z-index: 3;
margin-left: 500px;
}
</style>
</head>
<body>
<div id="odin">
****<div id="tri">
*<div id="tritri">3333333333333</div>
*<div id="dva">
*22222222222
*</div>
****</div>
</div>
</body>
</html> *
!DOCTYPE для начала нормальный поставьте.
Господи, так я ж для примера написал! тут и такой:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "DTD/xhtml1-strict.dtd">
подойдет!
Такой тоже не подойдет.
просвятите, плз, какой нужен и как вы определили?
с этим:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "DTD/xhtml1-strict.dtd">
работает всё как нужно... [Only registered and activated users can see links. Click Here To Register...]
оффтоп:
Просто ув. Aykroyd набивает себе посты, поэтому ему не выгодно сразу ответить на Ваш вопрос.
maza, не могли бы Вы показать скрин сайта или хотябы нарисуйте структуру. На счёт доктайпа, честно незнаю. Может ув. Aykroyd имел ввиду использовать Transitional:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
или же html 4.01
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
а вообще почему бы не создать див, высотой с шапку (relative), ниже ещё див в котором будет контент (relative), а ту колонку, которая должна налезать на шапку сделать absolute. Но следите: где в коде Вы пишите этот абсолют. т.е. попробуйте сначала в шапке написать, потом в контенте.
Так:
и так попробуй:Код:<div id="HEAD">
<div id="absolute">
</div>
<div id="content">
тут колонки
</div>
Код:<div id="HEAD">
</div>
<div id="content">
<div id="absolute">
тут колонки
</div>
как раз так мне нельзя было делать потому что та колонка, которая налезает на шапку — контентная колонка, т.е. в ней будет текст и соответственно высота будет неопределенной.Цитата:
а вообще почему бы не создать див, высотой с шапку (relative), ниже ещё див в котором будет контент (relative), а ту колонку, которая должна налезать на шапку сделать absolute.
так как я написал что с первым, что со вторым доктайпом прекрасно работатет, зачем скрин?
создайте html документ и вставьте код из пост №9
спасибо, serka, что вызвались помочь!
p.s.: не вижу смысла Aykroyd'у набивать себе посты, он и так, имхо, считает себя "папой" ,)
<div id="center">Цитата:
Originally posted by maza@Sep 10 2007, 09:28
[b]в 3-ей колонке идёт текст, который должен начинатся , скажем с самого вверха, а вверху, то у нас шапка! текст-то начинается сверху, но его шапка закрывает. И это только в ФФ! Вопрос: как заставить 3-юю колонку быть поверх шапки, но в тоже время чтобы шапка была поверх макета?
короче кодом типа так (3-мя колонками):
<div id="wapka">
* * <div id="left"></div>
* * <div id="right"></div>
</div>
колонка right допустим налазит на шапку.[/quote]
может я чтото не так понял, но вот стиль который у меня получился для приведенного вами html
Код:*{
****margin:0;
****padding:0;
****}
#wapka{
****height:155px;
****background-color: #000080;
****}
#left{
****margin-right:150px;
****background-color: #808008;
****
****/* temp */
****height:200px;
****}
#right{
****width:150px;
****position:absolute;
****top:0;
****right:0;
****background-color: #880000;
****
****/* temp */
****height:200px;
****}
Вы вроде как сделали по предложению serka'и.. а я писал в своём предыдущем посте, что нельзя было колонки делать абсолютными, можно только шапку...
Та ладно Вам , ребята, я ж сделал этот прикол уже - работает всё зашибись.
Покажу Вам сайт в котором это будем, когда сделаю! [Only registered and activated users can see links. Click Here To Register...] Ох там вёрстка бешенная.. Всё че хочешь есть...
Сейчас сижу думаю над вопросом, можно ли сверстать так, чтобы можно было выкусить кусок кода (например правую колонку в макете) чтобы сам макет не распался, просто остался с одной левой колонкой. Потом Наоборот, потом чтобы обе колонки можно было убрать, ну короче так) на таблицах уже давно реализовано. Может кто-то этим вопросом занимался уже? Может чёт посоветует.. [Only registered and activated users can see links. Click Here To Register...]
[/quote]Цитата:
Originally posted by serka@Sep 13 2007, 01:07
оффтоп:
Просто ув. Aykroyd набивает себе посты, поэтому ему не выгодно сразу ответить на Ваш вопрос.</span>
<div align=\'right\'>[Only registered and activated users can see links. Click Here To Register...]
<span style="color:purple">
Знаете, думать за других, какие цели они преследуют при том или ином действии – это плохая практика... Особенно в тематическом разделе...
А дядя Эйкройд с утра до вечера занят борьбой на ниве веб-стандартов... Поэтому очень устает... Поэтому шутки юмора понимает плохо...
Поэтому давайте я выпишу Вам для начала 10% за нарушение п.5 дополнительных правил раздела "Верстка сайта", не возражаете? Дабы не возникало в следующий раз соблазнов греховных...
[/quote]Цитата:
Originally posted by maza@Sep 13 2007, 00:34
просвятите, плз, какой нужен и как вы определили?
с этим:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "DTD/xhtml1-strict.dtd">
работает всё как нужно...* [Only registered and activated users can see links. Click Here To Register...]
<div align='right'>[Only registered and activated users can see links. Click Here To Register...]
С этим – все работает не как нужно, а в quirks mode. На самом деле существует сразу несколько причин почему я отмалчиваюсь по этому вопросу.
Первая – это то, что я просто устал на него отвечать. Если воспользоваться поиском по форуму – можно найти множество тому примеров. Во-вторых – примерно этот же вопрос поднимается буквально в соседней теме – "Копирайт не ездит по странице в IE6, помогите". Т.е. даже поиском пользоваться не надо. Третья причина – это то, что именно сейчас я занимаюсь написанием статьи по этому поводу. В частности, чем чреваты сокращенные варианты объявлений !DOCTYPE.
о! спасибо.
p.s.: не ужели иногда тяжело 1 предложение написать, например: "загляника в соседние темы" или "юзай поиск на счет доктайпа" вместо того чтобы отмалчиваться...
ещё хочу сказать, что я не прошу за меня думать, не прошу готовый код, я просто прошу совета, каким образом можно реализовать поставленную задачу.