Уверен будет полезная тема для всех кто занимаеться блочной версткой. Я в этом деле начинающий, возникают вопросы. здесь будуть разбиратьса эти вопросы и ответы на них, очень надеюсь что на все вопросы здесь будуть ответы.
#conteyner{ margin:0px; padding:0px; width:1000px; } #left{ margin:0px; padding:0px; width:184px; min-height:350px; background:url(../images/Left.png); float:left; } блок left находиться в conteyner. почему контейнер не расширяеться вместе с лефтом?
Для начала почитай основные приемы при при верстке слоями вот, для примера ты просто попытался по табличному начать верстать слоями
я понимаю что блоки могут выходить за рамки тех в которые вложеные, но ведь контейнер не имеет четких границ. он в теории должен растягиваться вместе с блоком, но он просто стоит на месте и все тут. сейчас перечитываю статейку, но если ктото скажет в чем проблема буду благодарен) это случайно не изза обтекаемости блока лефт?
LightStorm, Нет, как раз не могут. За исключением абсолютного позиционирования и отрицательных паддингов. Как так не имеет? А это что? width:1000px; и width:184px;? В особенности width:184px;, уберите и будет расширяться. И кстати, в осле такого нет: min-height:350px; и это не сработает. Ищите в инете, как это можно заменить, материал есть. Еще: background:url(../images/Left.png); не тру... а repeat задать? А позиционирование? Поставьте себе Firebug и экспериментируйте прямо из браузера на своем сайте.
у меня сайт не резиновый и по ширине только 1000 пикселей. а вот тянуться должно по длине. блок лефт идет с обтеканием, по этому за ним не тянться контейнер. как можна исправить даную проблему? ИЕ 6 и 7 пока что не использую, пишу для нормальных браузеров.
LightStorm, мы сейчас разговариваем о сферическом коне в вакууме. Дали бы глянуть сам сайт я бы что-нибудь порекомендовал.
</head> <body> <div id="mane"> <div id="fon"> <div id="head"> <div id="globus"></div> </div> <div id="logo"></div> <div id="head_n"></div> <div id="conteyner"> <div id="top"></div> <div id="left"></div> <div id="content"></div> </div> </div> <div id="top_footer"></div> <div id="footer"></div> </div> </body> </html> html, body{ margin:0px; padding:0px; height:100%; } #mane{ margin:0 auto; padding:0px; width:1000px; height:100%; } #fon{ margin:0px; padding:0px; width:1000px; min-height:100%; background-color:#FFCCCC; } #logo{ margin:0px; padding:0px; width:234px; height:132px; background:url(../images/logo.png) no-repeat; } #head{ margin:0px; padding:0px; width:766px; height:132px; background:url(../images/head.png) no-repeat; float:right; } #globus{ margin:0px; margin-left:600px; padding:0px; width:142px; height:184px; position:absolute; background:url(../images/globus.png) 0 100% no-repeat; } #head_n{ margin:0px; padding:0px; width:1000px; height:12px; background:url(../images/head_n.jpg); } #conteyner{ margin:0px; padding:0px; width:1000px; } #left{ margin:0px; padding:0px; width:184px; min-height:700px; background:url(../images/Left.png); float:left; } #top{ margin:0px; padding:0px; width:816px; height:40px; background-color:#B3C4D5; float:right; } #content{ margin:0px; padding:0px; width:816px; min-height:300px; background-color:#66FF66; float:right; } #top_footer{ margin-top:-30px; height:0px; clear:both; } #footer{ margin:0px; margin-top:-30px; padding:0px; width:1000px; height:30px; background-color:#000099; }
наверно в чтото не понимаете. все тянеться. прекрастно тянеться вслед за расширением блоков. высота проставлена в футера и топ блоков. в остальних только минимальная. к томуже если снять с блока лефт обтекание слева то все работает, но тогда возникают проблемы с определением места для других блоков. как исправить это? как заставить блок тянуться за расширяющимся блоком с стилем float?
