mogdalov
-
Posts
9 -
Joined
-
Last visited
mogdalov's Achievements
Explorer (1/14)
1
Reputation
-
Спасибо за то, что вы есть!
-
спасибо, тоже буду думать
-
Помогите разобраться! Есть 4 блока. Первый, второй и четвертый фиксирован по высоте (height задан в px), а третий блок должен быть резиновым, но при минимальном количестве информации он должен растягиваться так, чтобы футер был самой крайней точкой, как на скриншоте, только без полосы прокрутки. Что не пробовал, никак не могу реализовать. <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html> <head> <title>123</title> <meta name="robots" content="index, follow"> <meta http-equiv="content-type" content="text/html; charset=utf-8"> <link href="style.css" rel="stylesheet" type="text/css"> </head> <body> <div id="header"> <div class="logo"><a href="http://flexotex.by"><img src="pic/logo.png" alt="Flexotex"></a></div> </div> <div id="navi"> </div> <div id="maket"> <p>Ну что расскажешь?</p> </div> <div id="footer"> </div> </body> </html> body, html { margin:0px; padding:0px; height: 100%; background:#FDFDFD; } #header { width:900px; height:64px; margin:0 auto; box-shadow: 0 0 10px rgba(0,0,0,0.5); /*Параметры тени*/ background:#FDD800; } #navi { width:900px; height:30px; margin:0 auto; margin-top:20px; box-shadow: 0 0 10px rgba(0,0,0,0.5); /*Параметры тени*/ background:#FFFFFF; } #maket { width:900px; margin:0 auto; min-height:80%; /*border: solid 3px black;*/ box-shadow: 0 0 10px rgba(0,0,0,0.5); /*Параметры тени*/ background:#FFFFFF; /*padding: 10px;*/ margin-top:20px; } #footer { width:900px; height:50px; margin:0 auto; margin-top:20px; box-shadow: 0 0 10px rgba(0,0,0,0.5); /*Параметры тени*/ background:#FDD800; } .logo { margin-top:10px; margin-left:10px; float:left; }
-
Блин, точно, что-то я намудрил
-
Все, решил проблему, внес изменение в css .footer0 { width: 1000px; height: 50px; position: relative; bottom: 0px; } на .footer0 { width: 1000px; height: 50px; position: align; bottom: 0px; } и все пришло в норму
-
дизайн жесть
-
А вот на другой странице такая же проблема, только последняя иконка уже работает как ссылка и меняет обличие при наведении, в чем проблема? Но на этой странице футер залез на иконки, хотя все прописано нормально. при наведении самое интересное, что кнопка становится быть чувствительной под ссылкой на главную страниыу сайта, там где написано "С "Флексотекс" ООО, 2012" но футер должен быть таким Почему он лезет наверх? И почему декоративная полоска над футером лезет над кнопками с анимацией? Вот код: <html> <head> <title>Flexotex</title> <meta http-equiv="content-type" content="text/html; charset=utf-8"> <meta name="keywords"contente="пароизоляция, ветроизоляция, гидроизоляция"> <meta name="description" content="Паро-,ветро-, гидроизоляционные материалы ТМ Flexotex"> <link href="styleuse.css" rel="stylesheet" type="text/css"> </head> <body> <div class="mainframe"> <div class="header"> <div style="float:left;"><a href="index1.htm"><img src="head1.jpg" alt="Flexotex"></a></div> <div class="header1">Инфолиния: +375 25 5000900</div> <div class="menu"> <a class="menu1" href="aboutus.htm">О нас</a> <a class="menu1" href="prod.htm">Продукция</a> <a class="menu1" href="use.htm" style="color: #D9251C;">Применение</a> <a class="menu1" href="cert.htm">Сертификаты</a> <a class="menu1" href="wtb.htm">Где купить</a> <a class="menu1" href="cont.htm">Контакты</a> </div> </div> <div class="usetext1"><h1 style="margin-top: 10px; margin-bottom: 10px; font-weight: normal;">Область применения</h1></div> <div> <a href="#" class="p1"></a></div> <div> <a href="#" class="p2"></a></div> <div> <a href="#" class="p3"></a></div> <div> <a href="#" class="p4"></a></div> <div> <a href="#" class="p5"></a></div> <div> <a href="#" class="p6"></a></div> <div> <a href="#" class="p7"></a></div> <div> <a href="#" class="p8"></a></div> <div> <a href="#" class="p9"></a></div> <div class="footer0"> <div class="line2"></div> <div class="footer"> <div><a href="#" class="footer1">© "Флексотекс" ООО, 2012г</a></div> <div><a class="footer2">Продукция "Флексотекс": пароизоляция, ветрозащита, гидроизоляция, пленка, мембрана.</а></div> <div><a class="footer3" href="mailto:info@flexotex.by">info@flexotex.by</а></div> </div> </div> </div> </body> </html> и css .mainframe { /* border: 1px solid black; */ width: 1000px; margin: -5px auto -10px; } .header { /* border: 1px solid black; */ width: 1000px; height: 63px; } .logo { /* border: 1px solid black; */ background-repeat: no-repeat; float: left; } .header1 { float: right; font-family: "calibri"; padding-top: 5px; padding-right: 5px; } .menu { /* border: 1px solid black; */ padding-top: 20px; padding-right: 0px; float: right; } a.menu1 { font-family: "calibri"; } .menu1 { color: black; padding: 5px; text-decoration: none; } .menu1:hover { color: #D8D8D8; text-decoration: underline; } .line { background-image: url("line.jpg"); background-repeat: no-repeat; width: 1000px; height: 3px; margin-top: 10px; margin-bottom: 10px; } .usetext1 { font-family: "calibri"; } .hottext { /* border: 1px solid black; */ text-align: justify; font-family: "calibri"; } .usetext2 { font-family: "calibri"; margin-top: -10px; } a.p1 { background: url("mansarda.jpg"); display: block; width: 498px; height: 150px; float:left; padding-top: 2px; padding-bottom: 2px; background-repeat: no-repeat; } a.p1:hover { background: url("mansarda1.jpg"); background-repeat: no-repeat; } a.p2 { background: url("holodnaja.jpg"); display: block; width: 498px; height: 150px; float:right; padding-top: 2px; padding-bottom: 2px; background-repeat: no-repeat; } a.p2:hover { background: url("holodnaja1.jpg"); background-repeat: no-repeat; } a.p3 { background: url("cherdak.jpg"); display: block; width: 498px; height: 150px; float:left; padding-top: 2px; padding-bottom: 2px; background-repeat: no-repeat; } a.p3:hover { background: url("cherdak1.jpg"); background-repeat: no-repeat; } a.p4 { background: url("mezetaznoe.jpg"); display: block; width: 498px; height: 150px; float:right; padding-top: 2px; padding-bottom: 2px; background-repeat: no-repeat; } a.p4:hover { background: url("mezetaznoe1.jpg"); background-repeat: no-repeat; } a.p5 { background: url("cokolnoe.jpg"); display: block; width: 498px; height: 150px; float:left; padding-top: 2px; padding-bottom: 2px; background-repeat: no-repeat; } a.p5:hover { background: url("cokolnoe1.jpg"); background-repeat: no-repeat; } a.p6 { background: url("beton.jpg"); display: block; width: 498px; height: 150px; float:right; padding-top: 2px; padding-bottom: 2px; background-repeat: no-repeat; } a.p6:hover { background: url("beton1.jpg"); background-repeat: no-repeat; } a.p7 { background: url("karkasnaja.jpg"); display: block; width: 498px; height: 150px; float:left; padding-top: 2px; padding-bottom: 2px; background-repeat: no-repeat; } a.p7:hover { background: url("karkasnaja1.jpg"); background-repeat: no-repeat; } a.p8 { background: url("mezkomnatnoe.jpg"); display: block; width: 498px; height: 150px; float:right; padding-top: 2px; padding-bottom: 2px; background-repeat: no-repeat; } a.p8:hover { background: url("mezkomnatnoe1.jpg"); background-repeat: no-repeat; } a.p9 { background: url("ventiliruemij.jpg"); display: block; width: 498px; height: 150px; float:left; padding-top: 2px; padding-bottom: 2px; background-repeat: no-repeat; } a.p9:hover { background: url("ventiliruemij1.jpg"); background-repeat: no-repeat; } .footer0 { width: 1000px; height: 50px; position: relative; bottom: 0px; } .line2 { background-image: url("line.jpg"); background-repeat: no-repeat; width: 1000px; height: 3px; } .footer { /*border: 1px solid black;*/ font-family: "calibri"; width: 1000px; height: 50px; } .footer1 { /*border: 1px solid black;*/ font-family: "calibri"; color: black; text-decoration: none; } .footer1:hover { color: #D8D8D8; text-decoration: underline; } .footer2 { /*border: 1px solid black;*/ font-family: "calibri"; font-size: 14px; float: left; } .footer3 { /*border: 1px solid black;*/ font-family: "calibri"; font-size: 14px; float: right; }
-
Убираю весь footer0 и проблема исчезает...
-
Добрый день, код сырой, но дело в том что изначально проверял на Опере, потом выяснил, что популярнее в моем регионе Фаерфокс и решил на нем проверить. Был шокирован. Проблема в том, что при наведении на иконки в Опере меняется картинка, а в фаерфоксе не меняется, остается такой же, да и вообще ссылка не работает. Это мой первый сайт, делаю для себя, не профессионал, извините за трэш. <html> <head> <title>Flexotex</title> <meta http-equiv="content-type" content="text/html; charset=utf-8"> <meta name="keywords"contente="пароизоляция, ветроизоляция, гидроизоляция"> <meta name="description" content="Паро-,ветро-, гидроизоляционные материалы ТМ Flexotex"> <link href="style.css" rel="stylesheet" type="text/css"> </head> <body> <div class="mainframe"> <div class="header"> <div style="float:left;"><a href="index1.htm"><img src="head1.jpg" alt="Flexotex"></a></div> <div class="header1">Инфолиния: +375 25 5000900</div> <div class="menu"> <a class="menu1" href="aboutus.htm">О нас</a> <a class="menu1" href="prod.htm">Продукция</a> <a class="menu1" href="use.htm">Применение</a> <a class="menu1" href="cert.htm">Сертификаты</a> <a class="menu1" href="wtb.htm">Где купить</a> <a class="menu1" href="cont.htm">Контакты</a> </div> </div> <div><img src="line.jpg" width="1000px" height="1px" style="margin-top:10px; margin-bottom:10px;"></div> <div class="usetext1"><h1 style="margin-top: 10px; margin-bottom: 10px; font-weight: normal;">Защита строительных конструкций от разрушительной влаги</h1></div> <div class="hottext"> <img src="picforhottext.jpg" alt="Стропильная конструкция" style="float: left; margin-right: 20px;"> <p style="text-indent: 40px;">Строительные разработки последних десятилетий полностью изменили традиционную скатную кровлю. Не используемый ранее чердак, способствующий благодаря содержащемуся в нем большому количеству воздуха непрерывному выравниванию температуры и влажности, теперь оборудуется подкровельными пленками.</p> <p style="text-indent: 40px;">Принимая во внимание многообразие теплоизоляционных материалов, чердачное помещение можно оборудовать так, чтобы оно стало жилым помещением - мансардой. С точки зрения строительной физики мансарда является одним из наиболее нагруженных элементов жилища, воспринимающая как внешние воздействия (атмосферные осадки, солнечную радиацию, ветровые нагрузки и др.), так и внутренние - перепад температуры и влажности.</p> <p style="text-indent: 40px;">Конструкция утепленной кровли представляет собой многослойный корпус, составленный из разнородных материалов, в котором каждый отдельный слой играет свою незаменимую роль. Подкровельная ветро-гидроизоляция и пароизоляционный барьер являются при условии правильного применения одним из основных факторов, определяющим надежность, долговечность, комфортность и экономичность мансардных помещений. <a class="index11" href="index11.htm">Читать далее...</a></p> </div> <div><img src="line.jpg" width="1000px" height="1px" style="margin-top:10px; margin-bottom:10px;"></div> <div class="usetext2"><h2 style="margin-top: 10px; margin-bottom: 10px; font-weight: normal;">Области применения</h2></div> <div> <a href="#" class="p1"></a></div> <div> <a href="#" class="p2"></a></div> <div> <a href="#" class="p3"></a></div> <div> <a href="#" class="p4"></a></div> <div> <a href="#" class="p5"></a></div> <div> <a href="#" class="p6"></a></div> <div> <a href="#" class="p7"></a></div> <div> <a href="#" class="p8"></a></div> <div> <a href="#" class="p9"></a></div> <div class="footer0"> <div><img src="line.jpg" width="1000px" height="1px" style="margin-top:10px; margin-bottom:10px;"></div> <div class="footer"> <div><a href="#" class="footer1">© "Флексотекс" ООО, 2012г</a></div> <div><a class="footer2">Продукция "Флексотекс": пароизоляция, ветрозащита, гидроизоляция, пленка, мембрана.</а></div> <div><a class="footer3" href="mailto:info@flexotex.by">info@flexotex.by</а></div> </div> </div> </div> </body> </html> и css .mainframe { /* border: 1px solid black; */ width: 1000px; margin: -5px auto -10px; } .header { /* border: 1px solid black; */ width: 1000px; height: 63px; } .header1 { float: right; font-family: "calibri"; padding-top: 5px; padding-right: 5px; } .menu { /* border: 1px solid black; */ padding-top: 20px; padding-right: 0px; float: right; } a.menu1 { font-family: "calibri"; } .menu1 { color: black; padding: 5px; text-decoration: none; } .menu1:hover { color: #D8D8D8; text-decoration: underline; } .usetext1 { font-family: "calibri"; } .hottext { /* border: 1px solid black; */ text-align: justify; font-family: "calibri"; } .usetext2 { font-family: "calibri"; margin-top: -10px; } .index11 { text-decoration: none; color: black; } .index11:hover { text-decoration: underline; color: #D8D8D8; } a.p1 { background: url("mansarda.jpg"); display: block; width: 498px; height: 150px; float:left; padding-top: 2px; padding-bottom: 2px; background-repeat: no-repeat; } a.p1:hover { background: url("mansarda1.jpg"); background-repeat: no-repeat; } a.p2 { background: url("holodnaja.jpg"); display: block; width: 498px; height: 150px; float:right; padding-top: 2px; padding-bottom: 2px; background-repeat: no-repeat; } a.p2:hover { background: url("holodnaja1.jpg"); background-repeat: no-repeat; } a.p3 { background: url("cherdak.jpg"); display: block; width: 498px; height: 150px; float:left; padding-top: 2px; padding-bottom: 2px; background-repeat: no-repeat; } a.p3:hover { background: url("cherdak1.jpg"); background-repeat: no-repeat; } a.p4 { background: url("mezetaznoe.jpg"); display: block; width: 498px; height: 150px; float:right; padding-top: 2px; padding-bottom: 2px; background-repeat: no-repeat; } a.p4:hover { background: url("mezetaznoe1.jpg"); background-repeat: no-repeat; } a.p5 { background: url("cokolnoe.jpg"); display: block; width: 498px; height: 150px; float:left; padding-top: 2px; padding-bottom: 2px; background-repeat: no-repeat; } a.p5:hover { background: url("cokolnoe1.jpg"); background-repeat: no-repeat; } a.p6 { background: url("beton.jpg"); display: block; width: 498px; height: 150px; float:right; padding-top: 2px; padding-bottom: 2px; background-repeat: no-repeat; } a.p6:hover { background: url("beton1.jpg"); background-repeat: no-repeat; } a.p7 { background: url("karkasnaja.jpg"); display: block; width: 498px; height: 150px; float:left; padding-top: 2px; padding-bottom: 2px; background-repeat: no-repeat; } a.p7:hover { background: url("karkasnaja1.jpg"); background-repeat: no-repeat; } a.p8 { background: url("mezkomnatnoe.jpg"); display: block; width: 498px; height: 150px; float:right; padding-top: 2px; padding-bottom: 2px; background-repeat: no-repeat; } a.p8:hover { background: url("mezkomnatnoe1.jpg"); background-repeat: no-repeat; } a.p9 { background: url("ventiliruemij.jpg"); display: block; width: 498px; height: 150px; float:left; padding-top: 2px; padding-bottom: 2px; background-repeat: no-repeat; } a.p9:hover { background: url("ventiliruemij1.jpg"); background-repeat: no-repeat; } .footer0 { width: 1000px; height: 50px; position: relative; bottom: 0px; } .footer { /*border: 1px solid black;*/ font-family: "calibri"; width: 1000px; height: 50px; } .footer1 { /*border: 1px solid black;*/ font-family: "calibri"; color: black; text-decoration: none; } .footer1:hover { color: #D8D8D8; text-decoration: underline; } .footer2 { /*border: 1px solid black;*/ font-family: "calibri"; font-size: 14px; float: left; } .footer3 { /*border: 1px solid black;*/ font-family: "calibri"; font-size: 14px; float: right; } Проблема c p1 по p9. Спасибо за ответы!
