tarkinsky
-
Posts
17 -
Joined
-
Last visited
tarkinsky's Achievements
Explorer (1/14)
0
Reputation
-
Помогите плиз уже два дня мучаюсь. Есть код в котором многое прописано с помощью position: absolute; Главное что так прописан и footer. вот кусок кода: HTML: <div id="footer_carrier"> <div id="footer"> <div id="footer1"> <div id="footer_text"> Праздничные и фасадные работы для Вас и Вашей семьи! </div> </div> </div> </div> CSS: #footer_carrier{ background: url(pics/footer_border.gif) top left repeat-x; height: 50px; width: 100%; position: absolute; top: 100%; } #footer{ background: #ebebeb; height: 65px; margin-top: 3px; font-family: 'Tahoma'; font-size: 11pt; padding-left: 10px; } #footer1{ background: url(pics/hearts.gif) top right no-repeat; height: 65px; margin: 0px; } #footer_text{ padding-left: 5px; padding-top: 5px; } Обратите внимание на: footer_carrier - top: 100%; position: absolute; При разрешении 1024 на 768 все отлично и футер находится в самом низу. А если выставить 1280 на 1024 то видно следующее: Скрин (футер не прижат снизу ... там идет белая полоса). Подскажите решение? или хотя бы намекните как можно попробовать прижать футер к низу именно в моей ситуации?
-
Уже два дня мучаюсь с проблемой... Во всех браузерах приведенный ниже код, нормально растягивает средний блок div (синий) на 100%, а в IE 6 по краям получаются какие то отступы (при разрешении 1280х1024). Подскажите плиз в чем может быть дело? Вот код: <div id="header"> <a href="pa1.ru" title="Строительная компания" style="text-decoration: none;"> <div id="header1"> </div></a> <div id="header2"> </div> <div id="header3"> </div> </div> <div id="header_sign"> постройка домов, бань </div> <div id="logo_sign"> <strong>Cтроительная компания</strong> </div> Код CSS: #header_sign{ position: absolute; left: 192px; top: 152px; width: 330px; font-family: 'Tahoma'; font-size: 75%; color: #444; } #logo_sign{ position: absolute; left: 756px; top: 150px; width: 252px; font-family: 'Verdana'; font-style: italic; font-size: 90%; color: white; } #header{ overflow: hidden; } #header, #header1, #header2, #header3{ height: 188px; } #header1{ background: green; width: 746px; float: left; overflow: hidden; border: 1px solid black; margin: 0px; padding: 0px; } #header2{ float: right; background: red; overflow: hidden; width: 239px; margin: 0px; padding: 0px; border: 1px solid black; } #header3{ margin-left: 746px; margin-right: 239px; width: auto; background: blue; border: 1px solid black; height: 100%; } Изображение в IE6: Изображение в firefox:
-
У меня 6 для проверки.
-
Там будет тоже самое, я уже убирал... Так все и остается, те картинки с отступом от красного блока((
-
Помогите пожалуйста. Вот сверстал по советам хэдар. Середина должна растягиваться до левой и правой картинки, в Firefox все ок, но в IE по бокам почему то остаются полосы(( Вот код HTML: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="ru"> <head> <link rel="stylesheet" type="text/css" href="styles.css" /> <!--[if IE]> <link rel="stylesheet" type="text/css" href="ie_styles.css" /> <![endif]--> </head> <body> <div id="main"> <div id="header_carrier"> <div id="header_left_build"> </div> <div id="header_right_build"> </div> <div id="header_build_prolong"> </div> </div> </div> </body> </html> Вот код css: html, body, #main{margin:0; padding:0; position:relative; width: 100%;} body{ width: 100%; height: 100%; background: url(pics/background_color.gif) repeat-x; padding-bottom: 1%; } #main{ margin: 0px 3px; width: auto; height: auto; position: auto; min-height: 100%; height: auto !important; height: 100%; } #header_carrier{ margin: 0px; padding: 0px; width: 100%; height: 202px; border: 1px solid blue; } #header_left_build{ margin: 0px; padding: 0px; height: 100%; background: url(pics/header_building_left.gif) top left no-repeat; width: 364px; float: left; border: 1px solid red; } #header_right_build{ margin: 0px; padding: 0px; height: 100%; background: url(pics/header_building_right.gif) right center no-repeat; float: right; width: 365px; border: 1px solid black; } #header_build_prolong{ margin: 0px; padding: 0px; height: 100%; background: url(pics/header_building_prolong.gif) top left repeat-x; background: red; margin-left: 364px; margin-right: 365px; border: 1px solid green; width: auto; } Вот скриншот как есть сейчас (именно в IE) в firefox все четко! - СКРИН
-
Верстка header'a div-aми (резиновый дизайн)
tarkinsky replied to tarkinsky's question in HTML Coding
Если всем трем поставить то среднюю вообще не видно, она же пустая поэтому не тянется((( А если ей 100% поставить то уезжает правая часть далеко( -
Люди помогите пожалуйста ... нужно сверстать div-ами хэдер для сайта (см. скриншот) идея такая: слева и справа на одном уровне две готовые картинки с шириной 365пкс и 364 пкс, а в центре (между ними) растягивающаяся картинка. Код прилагается. За ранее спасибо. ХТМЛ <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="ru"> <head> <meta name="robots" content="all" /> <meta http-equiv="Content-Type" content="text/html; charset=windows-1251" /> <link rel="stylesheet" type="text/css" href="styles.css" /> </head> <body> <div id="main"> <div id="header_carrier"> <div id="header_left_build"> </div> <div id="header_build_prolong"> </div> <div id="header_right_build"> </div> </div> </div> </body> </html> css /* CSS Document */ html, body, #main{margin:0; padding:0; position:relative; width: 100%;} body{ width: 100%; height: 100%; background: url(pics/background_color.gif) repeat-x; padding-bottom: 1%; } #main{ width: 100%; height: 100%; margin: 3px; margin-top: 0px; border: 1px solid black; } #header_carrier{ width: 100%; height: 202px; } #header_left_build{ height: 100%; background: url(pics/header_building_left.gif) top left no-repeat; width: 364px; float: left; } #header_right_build{ height: 100%; background: url(pics/header_building_right.gif) right center no-repeat; float: right; width: 365px; } #header_build_prolong{ height: 100%; background: url(pics/header_building_prolong.gif) top left repeat-x; } * div{ border: 0px solid black; } Скриншот как надо а сейчас картинка №2 (правая) уехала вниз((
-
Не должен. Курите, например, Мейера, главу про флоаты. Менять без вариантов нужно именно так((
-
Ребят а подскажите как сверстать такую штуку (смотри скрин). ФОТО Вот HTML: <div id="t0"> <div id="t1"> </div> <div id="t2"> </div> <div class="t3"> </div> </div> Мне нужно чтобы блок 1 был 100 px, блок 3 - был 100 px, блок 2 растягивался на все остальне пространство. Проблема в том что они не находятся на одной линии (1-ый стоит как и должен стоять, а вот второй, почему то смещается по горизонтали вниз (когда должен быть на одной линии с первым), выходя за слой t0) Подскажите как сделать? Спасибо.
-
Спасибо большое про невозможность вложенности ul правда не знал! А насчет верстки то это только кусочек .... там большой код PHP у меня проект просто горел некогда было толково сверстать. Еще раз спасибо
-
Извините я с работы писал и комп завис думал что не прошло... удалю...
-
Помогите пожалуйста кто чем сможет! Проблема что последнее правило в коде не применяется, я его и со звездочкой пробовал, и вообще не применяются правила с div и class. Но зато применяются первые три правила в полном объеме?!? <div id="full_news_h"> Документы </div> <div id="welcome_text"> <style type="text/css"> #welcome_text p{ margin-bottom: 7px; } #welcome_text p a, #welcome_text p a:visited, #welcome_text p ul li a{ text-decoration: none; font-size: 17px; } #welcome_text p a:hover{ text-decoration: underline; } #welcome_text p ul#spisok{ эти правила работать не будут!!!! } #welcome_text p * #spisok{ И эти правила работать не будут!!!! } </style> <p> Правовая основа <ul id="spisok1" style="margin-left: 25px;"> <li><a href="">Лицензия</a></li> <li></a href="">Государственная аккредитация</a></li> <li><a href="">Устав</a></li> </ul> </p> <p> <a href= "../gallery/other/docs/ustav.doc">Устав гимназии</a> <br/> </p> <p> <a href= "../gallery/other/docs/Reception_rules.doc">Правила приема</a> <br/> </p> <p> <a href= "../gallery/other/docs/Development_program.doc">Программа развития</a> <br/> </p> <p> <a href= "../gallery/other/docs/Education_program.doc">Образовательная программа</a> <br/> </p> <p> <a href= "../gallery/other/docs/Public_report_2009-2010.doc">Публичные доклады</a> </p> </div> </td> </tr> </table> </div> </div> Подскажите плиз в чем дело??
-
Помогите плиз пишу стили в самом документе а применяются только некоторые! <div id="welcome_text"> <style type="text/css"> #welcome_text p{ margin-bottom: 7px; } #welcome_text p a, #welcome_text p a:visited{ text-decoration: none; font-size: 17px; } #welcome_text p a:hover{ text-decoration: underline; } #welcome_text p ul#spisok1{ margin-left: 15px; font-size: 24px; } </style> <p> Правовая основа <ul id="spisok1" style="margin-left: 25px;"> <li><a href="">Лицензия</a></li> <li></a href="">Государственная аккредитация</a></li> <li><a href="">Устав</a></li> </ul> </p> <p> <a href= "../gallery/other/docs/ustav.doc">Устав гимназии</a> <br/> </p> <p> <a href= "../gallery/other/docs/Reception_rules.doc">Правила приема</a> <br/> </p> <p> <a href= "../gallery/other/docs/Development_program.doc">Программа развития</a> <br/> </p> <p> <a href= "../gallery/other/docs/Education_program.doc">Образовательная программа</a> <br/> </p> <p> <a href= "../gallery/other/docs/Public_report_2009-2010.doc">Публичные доклады</a> </p> </div> Не работает последнее правило которое написано #welcome_text p ul#spisok1, и вообще все class или div. Но верхние три правила работают! Подскажите плиз в чем может быть дело?
-
Я вставил: <div id="ads_carrier"> <span style="display: block; clear: both;"> <a href="../"><img class="ad_img" src="pics/ad_home.gif" /></a> <a href="../"><img class="ad_img" src="pics/ad_bath.gif" /></a> <a href="../"><img class="ad_img" src="pics/ad_room.gif" /></a> <a href="../"><img class="ad_img" src="pics/ad_roof.gif" /></a> </span> </div> Ничего не изменилось((( Я хочу потом чтобы они подсвечивались.. (вторую такую же картинку только яркую при наведении)
-
Если поставлю родителю overflow: hidden; то изображений вообще видно не станет ... а мне нужно чтобы они внутри diva помещались.. а он соотвествтенно растягивался(((