nikudza
-
Posts
9 -
Joined
-
Last visited
nikudza's Achievements
Explorer (1/14)
0
Reputation
-
Как втулить два relative div-а в один родительский?
nikudza replied to nikudza's question in HTML Coding
sigma77, проблема в том, что правый див уползает прямо под левый, какие бы координаты ему ни задавались. yujin11, дык с absolute эт все могут:) Именно relative. -
Как втулить два relative div-а в один родительский?
nikudza replied to nikudza's question in HTML Coding
Извиняюсь, но оживлю тему. Скажите, просто из любопытства - а это вообще возможно сделать? Вот где-то так: -
psywalker, не наказывайте его, он сегодня, между прочим, жизнь спас!.. На скорую руку))
-
Как втулить два relative div-а в один родительский?
nikudza replied to nikudza's question in HTML Coding
Всем спасибо за ответы, общая проблема решена в другой теме другим способом, за что спасибо товарищу igon -
igon, кажется, ты спас меня от разрыва мозга, бьюсь над этой штуковиной уже не первую неделю! Огромное спасибо! Буду теперь разбираться)) Не знаю, какая здесь, на этом форуме, система благодарностей, как я могу осуществить тебе плюс в репу или что-то подобное?
-
Тут не уверен, может и необязательно. Только что попробовал отключить - вроде и без него работает. Да только не суть это...
-
Итак, дано: <div id="content"> - position:relative; <div id="main"></div> - position:relative; margin-right:250px; <div id="sidebar"></div> - width:250px; position - ? </div> Есть родительский div - content. position:relative. В нем два других - main и sidebar. Main - слева. Sidebar (250px) - должен быть - справа. Main - position:relative, правый margin - 250px - по ширине sidebar-а. Если прописываю sidebar-у float:right - он остается справа, но уезжает вниз. Если делаю sidebar тоже relative, то он уезжает вообще под main, даже если ставлю top:0; right:0; И только если sidebar position:absolute - всё норм. Но тогда он кладет на правила родительского div, что меня не устраивает. Как разместить оба дочерних div-а в одном родителе, используя position:relative - один слева, другой справа? На одном уровне.
-
Да футер-то прижат, но только content-ом и дочерним main-ом, а сайдбар всё равно проваливается. ПОД прижатый футер. Потому что спозиционирован абсолютно и, соответственно, с родительским дивом (content) свои действия не соотносит. А если его позиционировать relative, то вообще странно себя ведет и жмется к левому краю и вниз, хоть и пишу ему top:0; right:0;. В соседних темах, конечно, посмотрю, но был бы благодарен и за реальный совет.
-
Может здесь помогут... Хелп, едет крыша! Короче, суть проблемы такова: есть двухколоночный страниц - шапк, левый блок (основной), правый блок (сайдбар, фиксированная ширина), блок-прижиматель футера к низу, ну и - прижатый им к низу футер. Так вот, левый (основной) блок прекрасно тянется в высоту насколько нужно и прижимает футер, а правый - сайдбар (или параграф внутри него?) - этот самый футер прекрасненько протыкает (патамушта спозиционирован абсолютно). И висит там под футером как... неприличное что-то, ей-богу. Чего только ни пробовал - ничего не помогает! Короче, код: <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> <title>Страница</title> <link href="style2.css" rel="stylesheet" type="text/css"> </head> <body> <div id="content"> <div id="header"> HEADER </div> <div id="background"></div> <div id="main"> <p> Content Content Content Content Content Content Content Content Content Content Content Content Content Content Content Content Content Content Content Content Content Content Content Content Content Content Content Content Content </p> </div><!--end main--> <div id="sidebar"> <p> Sidebar Link Link Link Link Link Link Link Link Link Link Link Link Link Link Link Link Link Link Link Link Link Link Link Link Link Link Link Link Link Link Link Link Link Link Link </p> </div> <div class="empty"></div> </div><!--end content--> <div id="footer"> footer </div> </body> </html> html, body{ margin:0; padding:0; width:100%; height:100%; } #header{ height:80px; width:100%; background-color:yellow; } #content{ position:relative; min-height:100%; height:auto !important; height:100%; text-align:justify; background-color:green; } #content p{ padding:10px 15px 10px 7px; margin:0; } #content .empty{ height:50px; position:relative; border:1px black dotted; } #background{ position:absolute; top:80px; right:250px; bottom:0; left:0; background-color:white; } #main{ position:relative; min-height:100%; height:100%; margin-right:250px; background-color:fff; } #sidebar{ width:250px; position:absolute; top:80px; right:0; } #sidebar p{ margin:10px; background:blue; } #footer{ position:relative; margin-top:-20px; height:20px; width:100%; background-color:brown; text-align:center; } Содержимое колонок оставил специально, наглядности для, из кода же постарался всё лишнее убрать, но если где-то какие-то следы экспериментов - уж не обессудьте! Посмотреть: Просто страница Хорошая, годная страница (сайдбар короче и всё норм) Плохая страница (сайдбар пробил футер) С float-ом уже советовали Цвета специально вырвиглазные, для наглядности же))