mazhar
-
Posts
20 -
Joined
-
Last visited
Content Type
Profiles
Forums
Calendar
Store
Everything posted by mazhar
-
Это мой шаблон <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <title>{if isset($detail_title)}{$detail_title}{else}{title}{/if}</title> {stylesheet} {metadata} <meta http-equiv="content-type" content="text/html; charset=utf-8" /> <link href="css/style.css" rel="stylesheet" type="text/css" /> <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4/jquery.min.js"></script> <script type="text/javascript" src="zoom/zoom.js"></script> <link rel="stylesheet" type="text/css" media="all" href="zoom/zoom.css" /> </head> <body> <div id="wrapper"> <div id="header"></div> <!-- #header--> <div id="middle"> <div id="container"> <div id="content"> <h1>Продукция</h1> <hr /> <div class="table"> {content} </div><!--class table--> </div> <!-- #content--> </div> <!-- #container--> <div class="sidebar sl"> <div class="menu"> {menu start_level ="1" number_of_levels="2"} </div> </div> <!-- .sidebar.sl --> <div class="sidebar sr"></div> <!-- .sidebar.sr --> </div><!-- #middle--> </div><!-- #wrapper --> <div id="footer"> <!--LiveInternet counter--><script type="text/javascript"><!-- document.write("<a href='http://www.liveinternet.ru/click' "+ "target=_blank><img src='//counter.yadro.ru/hit?t52.6;r"+ escape(document.referrer)+((typeof(screen)=="undefined")?"": ";s"+screen.width+"*"+screen.height+"*"+(screen.colorDepth? screen.colorDepth:screen.pixelDepth))+";u"+escape(document.URL)+ ";"+Math.random()+ "' alt='' title='LiveInternet: показано число просмотров и"+ " посетителей за 24 часа' "+ "border='0' width='88' height='31'><\/a>") //--></script><!--/LiveInternet--> </div><!-- #footer --> </body> </html> По поводу скрытого смысла - это я немного экспериментировал, надеялся, что поможет ослику правильно понять отображение списка. Нужно, очень, чтобы отображался и в 6 и 7 експлорере одинаково. Что делать? Подскажите?
-
style .sl { float: left; width: 302px; margin-left: -100%; position: relative; background: #FFFFFF url(../images/newlogo.jpg) no-repeat; height: 268px; } .menu { background: #FFFFFF; position: relative; top: 268px; } .menu ul { height: auto; list-style-type: none; padding-left: 0px; margin-left: 0px; padding-top: 15px; } .menu li { background: url(../images/menu3.png) no-repeat center center; padding: 8px 0px 12px; } .menu li:hover { background: url(../images/menu_hover2.png) no-repeat center center; padding: 8px 0px 12px; } .menu a { text-decoration: none; font-family: Georgia, "Times New Roman", Times, serif; font-size: 14px; font-weight: bold; color: #333333; margin-left: 100px; } .sub li { background: url(none)!important; margin: 0px; padding: 3px 80px 0px; } .sub li { background: url(none); padding: 8px 0px 4px; } .sub li:hover { background: url(none); padding: 8px 0px 4px; } .sub a { text-decoration: none; font-family: Georgia, "Times New Roman", Times, serif; font-size: 14px; font-weight: normal; color: #333333; margin-left: 80px; } .sub a:hover { color: #FF0000; text-decoration: underline; } /* Sidebar Right —————————————————————————--*/ .sr { float:right; margin-top: 0px; margin-right: -3px; margin-left: 807px; position: absolute; background: #FFFFFF url(../images/sr.gif) no-repeat; height: 790px; width: 193px; display:block; }
-
Есть сайт который работает нормально везде, кроме ослика и его старшего брата. Вот в чем проблема, список начиная с атласной ткани должен идти без фоновой картинки. В остальных браузерах отображается как надо. И есче, почему то уходит правая фоновая картинка куда-то? Помогите разобраться, спасибо.
-
Ой-ее!!! Хорошо хоть в бан не заслали. Исправляюсь.... Был у меня вот такой код. Ослик(IE6) выдавал ошибку показанную на картинке в первом посте... <ul> <li></li> <li></li> <ul> <li></li> <li></li> </ul> <li></li> </ul> Правильный оказался такой... <ul> <li></li> <li></li> </ul> <ul> <li></li> <li></li> </ul> <ul> <li></li> </ul> И все стало на место в ослике.
-
Вот такая незадача... Есть список и в него вложенный еще один список... В одном списке у тега "ли" в стилях стоит бэкграунд имеж. Во вложенном списке через стиль бекграунда нет. Вроде все просто, но не для ослика...) Именно там где вкладывается второй список, ослик бекграунд тега ли размещает ровно по центру вложенного списка??? Короче посмотрите сами и прошу Вас помочь разобраться с осликом. Все разобрался!!! Как знал, стоит только написать и приходит от Бога ответ!!!! Извините я бы удалил эту тему, но не знаю как!!! Есче раз извините!!!
-
Да так вроде все понятно, спасибо. Но после вода этого кода, футер появляется под хедером!? Как и в мнгогих других вариантах предлагаемых на просторах инета. Может это из-за того что мои блоки позиционированны absolute? И есче хотел спросить, у меня сайт шириной 1000 пкс и вроде бы не должно быть ни каких отступов от окна браузера, но увы, появился отступ с права примерно в пикселей 5 во всех браузерах!? Подскажите что может быть? В моей верстке даже когда я создаю пустой див сразу над футером, он почему то становится под хедер!? Помогите, плиз, разобраться!!!
-
Да ты что? Так трудно, если есть возможность, написать что куда впихнуть? Я и так этих примеров с прижатием футера пересмотрел куча, но к своему сайту прилепить НЕ МОГУ !!!! Поэтому надеялся, что здесь разъяснят, а не ссылками...
-
вставлял этот код. Добавляется новый блок и прижимается к верхнему левому углу?
-
К сожалению не получается у меня так как предлагают. Пробовал разными вариантами, но скорее всего это я что-то не понимаю. Поэтому прошу Вас помочь мне разобраться.
-
Помогите прижать футер. вот код <!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"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>Костюмные ткани, лето</title> <link rel="stylesheet" type="text/css" href="../css/style.css" /> </head> <body> <div id="main"> <div id="header"> </div> <div id="container"> <div id="logo"> </div> <div id="menu"> <ul> <li><a href="index.html">О компании</a></li> <li><a href="novinki.html">Новинки</a></li> <li><a href="product.html">Продукция</a></li> </ul> <ul class="spisok"> <li class="spisok"><a href="/" >- АТЛАС</a></li> <li class="spisok"><a href="/" >- ВЕЛЬВЕТ </a></li> <li class="spisok"><a href="/" >- ВЕЛЮР</a></li> <li class="spisok"><a href="/" >- ГИПЮР</a></li> <li class="spisok"><a href="/" >- ДЖИНС</a></li> <li class="spisok"><a href="/" >- КОЖА искусственная</a></li> <li class="spisok"><a href="/" >- КОСТЮМНЫЕ зима</a></li> <li class="spisok"><a href="/product_kost_leto.html" >- КОСТЮМНЫЕ лето</a></li> <li class="spisok"><a href="/" >- ПАЛЬТОВАЯ</a></li> <li class="spisok"><a href="/" >- ПЛАЩЕВАЯ</a></li> <li class="spisok"><a href="/" >- ТВИД</a></li> <li class="spisok"><a href="/" >- ТРИКОТАЖ зима</a></li> <li class="spisok"><a href="/" >- ТРИКОТАЖ лето</a></li> <li class="spisok"><a href="/" >- ШИФОН</a></li> </ul> <ul> <li><a href="skidki.html">Скидки</a></li> <li><a href="kontact.html">Контакты</a></li> <li><a href="karta_proezda.html">Карта проезда</a></li> </ul> </div> <div id="content"> <h1>Продукция/Костюмные лето </h1> <hr /> <div> <table class="table1" cellspacing="0"> <tr> <td width="150px"><a href="/"><img src="images/tl.gif" /></a></td> <td><b>Батист</b> <p> <a href="/"><br /><b>Ткань предназначена для курток, брюк.<br /> Большая цветовая гамма.</b> </a></p></td> </tr> <tr> <td colspan="2" class="td2" height="20px"><a href="/">Подробнее</a></td> </tr> </table> <table class="table2" cellspacing="0"> <tr> <td width="150px"><a href="/"><img src="images/tl.gif" /></a></td> <td><strong>Вискоза Индонезия</strong> <br /> Ширина: 1.5 м<br /> <a href="/"><b>Ткань предназначена для курток, брюк.<br /> Большая цветовая гамма.</b></a></td> </tr> <tr> <td colspan="2" class="td2" height="20px"><a href="/">Подробнее</a></td> </tr> </table> <table class="table2" cellspacing="0"> <tr> <td width="150px"><a href="/"><img src="images/tl.gif" /></a></td> <td>Артикул: №7777777<br /> Ширина: 1.5 м<br /> <a href="/"><b>Ткань предназначена для курток, брюк.<br /> Большая цветовая гамма.</b> </a></td> </tr> <tr> <td colspan="2" class="td2" height="20px"><a href="/">Подробнее</a></td> </tr> </table> <table class="table2" cellspacing="0"> <tr> <td width="150px"><a href="/"><img src="images/tl.gif" /></a></td> <td>Артикул: №7777777<br /> Ширина: 1.5 м<br /> <a href="/"><b>Ткань предназначена для курток, брюк.<br /> Большая цветовая гамма.</b> </a></td> </tr> <tr> <td colspan="2" class="td2" height="20px"><a href="/">Подробнее</a></td> </tr> </table> </div><!--table--> <div id="rs"></div> </div><!--content--> </div> <!--container--> </div> <div id="footer"> <!--LiveInternet counter--><script type="text/javascript"><!-- document.write("<a href='http://www.liveinternet.ru/click' "+ "target=_blank><img src='//counter.yadro.ru/hit?t52.6;r"+ escape(document.referrer)+((typeof(screen)=="undefined")?"": ";s"+screen.width+"*"+screen.height+"*"+(screen.colorDepth? screen.colorDepth:screen.pixelDepth))+";u"+escape(document.URL)+ ";"+Math.random()+ "' alt='' title='LiveInternet: показано число просмотров и"+ " посетителей за 24 часа' "+ "border='0' width='88' height='31'><\/a>") //--></script><!--/LiveInternet--> </div> </body> </html> css * { padding:0; margin:0; } img { border: none; } html { height: 100%;} body { height: 100%; font: 9pt/18pt Verdana, Arial, Helvetica, sans-serif; color: #333333; } #header { background: #FFFFFF url(../images/header.gif) no-repeat; height: 163px; width: 1000px; margin: 0px; padding: 0px; } #logo { background: #FFFFFF url(../images/newlogo.jpg) no-repeat; position: absolute; width: 302px; height: 274px; top: 163px; left: 0px; margin: 0px; padding: 0px; } #content { background: #FFFFFF url(../images/index_051.gif) no-repeat; position: absolute; height: 100%; width: 475px; top: 163px; left: 302px; right: 193px; padding: 150px 15px 0px; margin: 0px; text-align: justify; } h1 { font-family: Georgia, "Times New Roman", Times, serif; font-size: x-large; font-weight: bold; color: #FF0000; line-height: normal; } #menu .spisok { background: url(none); margin: 0px; padding: 3px 0px 0px; } #menu .spisok:hover { background: url(none); margin: 0px; padding: 3px 0px 0px; } hr { color: #555; /*для IE */ background-color:#555; /*для Firefox, Opera, Safari*/ border:0px none; height:1px; /* высота 1px IE, Firefox, Opera, Safari */ clear:both; /* для очистки, если тег идет после float елемента */ margin: 0px 0px 20px; padding-bottom: 0px; } #rs { background: #FFFFFF url(../images/sr.gif) no-repeat; position: absolute; height: 637px; width: 193px; top: 0px; float: left; left: 505px; } #menu { background: #FFFFFF; position: absolute; width: 302px; top: 431px; left: 0px; margin: 0px; height: 749px; padding-top: 15px; } #menu a { text-decoration: none; font-family: Georgia, "Times New Roman", Times, serif; font-size: 14px; color: #333333; font-weight: bold; margin: 5px; padding: 0px 0px 0px 80px; } #menu ul { list-style: none; background: #FFFFFF; margin: 0px; padding: 0px; } #main { position: relative; min-height: 100%; } #menu li { background: url(../images/menu3.png) no-repeat center center; margin: 0px; padding: 5px 0px 12px; } #menu li:hover { background: url(../images/menu_hover2.png) no-repeat center center; margin: 0px; padding: 5px 0px 12px; } #menu .spisok a { font: normal 12px/normal "Times New Roman", Times, serif; margin: 0px; padding: 0px 0px 0px 80px; } #menu .spisok a:hover { color: #FF0000; text-decoration: underline; } #footer { height: 50px; position: absolute; left:0; bottom:0; width: 1000px; background-color: #999999; clear: both; top: 1850px; } * html .footer { bottomy:expression(parentNode.offsetHeight % 2 ? style.bottom="-1px" : style.bottom="0px"); /* хак для ие6, у которого есть косяк со смещением на 1px */ } /*——————tabl product—————-*/ table { width:225px; height:150px; border:solid 2px #FC0; margin-right:8px; margin-bottom:5px; float: left; border-collapse:collapse; padding: 0px; margin-top: 0px; } table a { text-decoration: none; } table a:hover { text-decoration: underline; color: red; } td, th { padding: 3px; color:red; border:none; } thead { background: url(images/fon_th.jpg) repeat-x; } th { font-family:Verdana, Geneva, sans-serif; font-size:14px; } th a { color: #333333; } th a:hover { color: #333333; } td { font-family:Verdana, Geneva, sans-serif; font-size:14px; vertical-align:top; } td a { color:#333333; } td a:hover { color:#333333; } .td1 { background-image: url(images/strelka.gif); background-repeat:no-repeat; background-position:right; padding-left:129px; padding-bottom:5px; } /*———-tabl product other————*/ .table1 { width: 100%; height: 150px; border: none; border-collapse:collapse; border-bottom: solid 2px #FC0; border-top: solid 2px #FC0; margin:0px; } .table2 { width: 100%; height: 150px; border: none; border-collapse:collapse; border-bottom: solid 2px #FC0; margin:0px; } .td2 { background-image: url(images/strelka.gif); background-repeat:no-repeat; background-position:right; padding-bottom:5px; } .td2 a { margin-left:385px; } .td2 a:hover { color: #333333; }
-
У меня не получается чтобы менялись картинки меню. Но я уже сделал с помощью css, но люди пишут, что если большой размер картинки, то долго грузиться будет и надо использовать JS/
-
Добрый день! Столкнулся с такой проблемой. Есть вертикальное меню, которое построено с помощью списка. Список состоит и 5 картинок-ссылок. Раньше этот макет был реализован с помощью таблиц и в нем при наведении на оду из картинок-ссылок менялась картинка. Я решил его переверстать с помощью блочной верстки и теперь не могу добиться такого же эффекта. У меня есть 5 картинок с желтым градиентом и 5 с красным. Это как должно выглядеть:
-
Попрубую
-
сделал так * { margin: 0; padding: 0; } *{zoom:1;} html {height: 100%} body { font: 12px/18px Arial, Tahoma, Verdana, sans-serif; width: 100%; height: 100%; И к сожалению ничего не изменилось
-
И куда это запехнуть?
-
Вот как выглядит страница в IE8 Так выглядит в IE6 Помогите, плиз, разобраться с этой кроссбраузерностью. +В opera при увеличении страницы появляются не желательные просветы. Разобраться бы из-за чего такое происходит? HTML <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <title></title> <meta http-equiv="content-type" content="text/html; charset=utf-8" /> <meta name="title" content="" /> <meta name="keywords" content="" /> <meta name="description" content="" /> <link rel="stylesheet" href="style.css" type="text/css" media="screen" /> </head> <body> <div id="wrapper"> <div id="header"><img src="images/header.gif" alt="" height="163" width="1000" /> </div><!-- #header--> <div id="middle"> <div id="container"> <div id="content"> <div class="text"> <h4> О компании </h4> <hr align="left" /> </div><p>Если Вы занимаетесь пошивом нательной и верхней одежды и у Вас есть одна швейная машина или большое швейное предприятие,...</p> <p>если у Вас небольшой магазин тканей или сеть магазинов,...</p> <p><b>- Вы попали прямо в цель.</b></p> <p> Мы понимаем, что рынок тканей развивается настолько динамично, что мы не можем позволить себе ориентироваться лишь на сегодняшний день.<br /> <br /> Нашей задачей является предоставление клиенту максимального ассортимента тканей, отвечающего любым его специфичным требованиям.<br /> <br /> Мы тесно контактируем с зарубежными партнерами, посещаем международные выставки и отслеживаем приоритеты рынка, предлагая затем нашим клиентам современные ткани от лучших производителей Кореи, Индонезии, Тайваня, Китая, Италии.<br /> <br /> Наш коллектив находится в постоянном поиске новых решений. </p> <p><b>Cуществует индивидуальная работа с клиентом на год вперед с подбором ткани.</b></p> <p>Покупать ткани оптом – значит экономить свое время и деньги. Гибкая ценовая политика нашей компании позволяет покупать ткани по наиболее выгодной цене. Ассортимент очень широк. <strong>Подробнее о тканях</strong> и их <strong><a href="http://sonatextiles.com.ua/product.html">ФОТО</a></strong> вы можете увидеть в разделе <a href="http://sonatextiles.com.ua/product.html"><strong>ПРОДУКЦИЯ</strong></a></p> <p>Ниже, вы можете ознакомится с небольшой частью ассортимента наших тканей</p> <p><strong>Джинсовая ткань</strong></p> <p>Джинс металлик, коттон, коттон полоска, кожа, на флисе, полоска, флок, цветной, флок роза, гобелен, газета, дранка, барашек на меху, мех тонкий на джинсе</p> <p><strong>Кожа</strong></p> <p>Кожа: крек, флок, на замше, джерси, крек, лак, перламутр, заплатки, тонкая, рептилия, на трикотаже, соло, лак соло, кожа смола, односторонняя, принтованная, металлик, цветная</p> <p><strong>Мех</strong></p> <p>Мех: шубный мутон, леопард, норка, енот , цветной, барашек, шиншилла, отделочный, норка щипанная, песец, Мех нерпа жаккард</p> <p><strong>Замш</strong></p> <p>Замш: рельеф, лазер, накатка, золото, вышивка, жатка, односторонний, цветной</p> <strong>Ткани трикотажные</strong> <p><strong>Трикотаж</strong><br /> В отличие от других текстильных изделий, трикотаж обладает растяжимостью по всем направлениям из-за возможности петель изменять форму и размеры. Рыхлая петельная структура придаёт трикотажу мягкость и несминаемость. </p> <p><strong>Спортивный трикотаж</strong><br /> Спортивный трикотаж чрезвычайно разнообразен и выполнен из трикотажных полотен из хлопка в смеси с волокнами эластана, лайкры, спандекса, полиэстера, полиэфира или полиакрила, это обеспечивает хорошее облегание и комфорт.</p> <strong>Ткани плательные, костюмные, блузочные, сорочечные</strong> <p><strong>Шифон</strong></p> <p> Тонкая шелковистая хлопчатобумажная ткань полотняного переплетения повышенной плотности. Применяют для пошива белья, блузок, платьев, а также в химической промышленности. У нас вы найдете: Шифон: креп вышивка, жатка, металлик, однотонный, цветной, жаккард, креп, галограмма, барбара, накатка, органза, перламутр, хамелеон, принтованный, полоска, атлас</p> <p><strong>Хлопок (стрейч) </strong></p> <p> Плотный, но удивительно легкий материал. Добавление эластичных волокон не позволяет ему сильно мяться. Широкая цветовая гамма, в основе которой множество ярких "летних" оттенков, делает эту ткань универсальной. В дорогих вариантах хлопка-стрейч присутствуют моменты "от кутюр", например, перьевые вкрапления. Пластичная, подчеркивающая линии тела ткань одинаково хорошо смотрится и в соблазнительных топах и в романтических платьицах. Не говоря уж о том, что хлопок - один из самых комфортных материалов в жаркий день. </p> <p><strong>Флок</strong></p> <p> Флок (заменитель традиционного бархата) - это обивочная ткань с основой из полиэстра и хлопка (обычно 35%-хлопок, 65%-синтетика), на которую электростатическим способом наносится капроновый или нейлоновый ворс, что придает флоку благородную бархатную поверхность. </p> <p><strong>Лён</strong></p> <p> Уникальные свойства льняных тканей: гладкость, умеренная жесткость, способность поглощать капельную влагу с соприкасающихся с ним поверхностей. Минимальная электризуемость, малая прилипаемость создают у человека приятное ощущение при соприкосновении его кожи с тканью. Достаточная воздухопроницаемость, гигроскопичность и влагоемкость обеспечивают быстрое удаление тепла и влаги с тела человека. </p> <p><strong>Вельвет</strong></p> <p> Плотная хлопчатобумажная или синтетическая ткань, имеющая налицевой поверхности продольные рубчики из уточного ворса (вельвет-корд - широкие, вельвет-рубчик - узкие). Из вельвета шьют куртки, костюмы и т. п. </p> <p><strong>Акрил</strong></p> <p> Акрил относится к группе полиакрилонитрильных волокон; на рынке акрил известен также под названиями «нитрон», «орлон», «ПАН-волокно» и «прелана». Сырье для получения акрила добывают из природного газа. Основные свойства акрила: прочность, термопластичность, светостойкость.</p> <p><strong>Гипюр</strong></p> <p>В нашем магазине тканей можно приобрести все виды гипюра – гипюр жаккард, набивной, люри, вышивка, сетка, тафта, однотонный принтованный, перламутр, чешуя, ажур, сетка, флок цветной, парча, люрикс. Если все это соответствует вашим вкусам, вы будете удовлетворены ассортиментом нашей компании. Перечисленные материалы помогут сделать ваш наряд еще более неординарным и запоминающимся.</p> <p>Сориентироваться во всем этом многообразии и выбрать те ткани, которые быстро будут проданы в розницу или использованы для пошива штор и драпировок, помогут наши продавцы.</p> </div><!-- #content--> </div><!-- #container--> <div class="sidebar sl"> <div id="logo"><img src="images/logo.gif" alt="" height="268" width="302" /></div> <div id="vert_menu"> <ul> <li><a href="/"><img src="images/index_10.gif" alt="оптовая продажа тканей" title="О компании" width="302" height="39" /></a></li> <li><a href="/novinki.html"><img src="images/index_11.gif" alt="продажа тканей" title="Новинки" height="40" width="302"/></a></li> <li><a href="/product.html"><img src="images/index_12.gif" alt="" title="Продукция" /></a></li> <li><a href="/skidki.html"><img src="images/index_13.gif" alt="" title="Скидки" /></a></li> <li><a href="/contact.html"><img src="images/kontact.gif" alt="" title="Контакты" /></a></li> <li><a href="/map.html"><img src="images/index_17.gif" alt="" title="Карта проезда"/></a></li> </ul> </div> </div><!-- .sidebar.sl --> <div class="sidebar sr"><img src="images/sr.gif" alt="" height="637" width="193" /> </div><!-- .sidebar.sr --> </div><!-- #middle--> </div><!-- #wrapper --> <div id="footer"> <table> <tr><td> <br><br> <!--LiveInternet counter--><script type="text/javascript"><!-- document.write("<a href='http://www.liveinternet.ru/click' "+ "target=_blank><img src='//counter.yadro.ru/hit?t52.6;r"+ escape(document.referrer)+((typeof(screen)=="undefined")?"": ";s"+screen.width+"*"+screen.height+"*"+(screen.colorDepth? screen.colorDepth:screen.pixelDepth))+";u"+escape(document.URL)+ ";"+Math.random()+ "' alt='' title='LiveInternet: показано число просмотров и"+ " посетителей за 24 часа' "+ "border='0' width='88' height='31'><\/a>") //--></script><!--/LiveInternet--></td> </tr> </table> </div><!-- #footer --> </body> </html> CSS-код * { margin: 0; padding: 0; } html {height: 100%} body { font: 12px/18px Arial, Tahoma, Verdana, sans-serif; width: 100%; height: 100%; } a { color: blue; outline: none; text-decoration: underline; } a:hover { text-decoration: none; } p {margin: 0 0 18px} img { border: none; } input {vertical-align: middle} #wrapper { width: 1000px; margin: 0 auto; min-height: 100%; height: auto !important; height: 100%; } /* Header —————————————————————————--*/ #header { height: 163px; background: #FFE680; } /* Middle —————————————————————————--*/ #middle { width: 100%; padding: 0 0 50px; height: 1%; } #middle:after { content: '.'; display: block; clear: both; visibility: hidden; height: 0; } #container { width: 100%; float: left; overflow: hidden; } #content { padding: 125px 200px 0 310px; background-image: url(images/index_05.gif); background-repeat: no-repeat; background-position: 302px 0px; background-color:#FFF; border:solid #000000; } /* Sidebar Left —————————————————————————--*/ .sl { float: left; width: 302px; margin-left: -100%; position: relative; background: #FFF; } /* Sidebar Right —————————————————————————--*/ .sr { float: left; margin-right: -3px; width: 193px; margin-left: -193px; position: relative; background: #FFF; } /* Footer —————————————————————————--*/ #footer { width: 1000px; margin: -50px auto 0; height: 50px; background: #FFF; } #footer table { margin: 0 50% 0 50%; } #vert_menu { text-decoration: none; } #vert_menu li { margin: -5px; list-style-type:none; } .text { margin:0px 0px; font-family: Georgia, "Times New Roman", Times, serif; font-size:24px; color:#F00; } hr { color: #555; /*для IE */ background-color:#555; /*для Firefox, Opera, Safari*/ border:1px none; height:2px; /* высота 1px IE, Firefox, Opera, Safari */ clear:both; /* для очистки, если тег идет после float елемента */ width:90%; margin:10px 0 10px -7px; }
-
Всем спасибо разобрался.
-
Дело в том, что psd макета нет. Есть сайт, который делался давно и сверстан он, к сажелению, не правильно.
-
Извините, исправлюсь. ))) Измерения исправлю. Намекните как сделать, чтобы блоки шли по горизонтали. Может ссылку, где про это написано. Спасибо. А почему я так думал, потому что в штмл странице написал выравнивание 1 картинки слева, другой по центру, а третей по правому краю?! Но теперь я понял свою ошибку, блочные элементы по умолчанию идут один под другим. Как их выровнять по горизонтали?
-
Доброй ночи! Спасибо за удобный, понятный для начинающих мастеров сайт! Удачи Вам и процветания! Обращаюсь к Вам за помощью.))) Пытаюсь сверстать шапку сайта, которая состоит из трех картинок. Сделал все вроде так, но не так.)))) Две картинки стали нормально (слева и по центру), а третья стала справа, но сместилась вниз ровно на ту высоту которая задана в шапке. Код прилагаю. Если можете, помогите разобраться, поделитесь опытом.)))) Заранее спасибо. HTML: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <title></title> <meta http-equiv="content-type" content="text/html; charset=utf-8" /> <meta name="title" content="" /> <meta name="keywords" content="" /> <meta name="description" content="" /> <link rel="stylesheet" href="style.css" type="text/css" media="screen" /> </head> <body> <div id="wrapper"> <div id="header"> <div id="logo"><img src="../../../sonatex/sonatextiles.com.ua/images/index_01.gif" alt="Сонатекстиль" width="302" height="163" align="left"</div> <div id="logo1"><img src="../../../sonatex/sonatextiles.com.ua/images/index_02.gif" alt="Сонатекстиль" width="505" height="163" align="middle"</div> <div id="logo2"><img src="../../../sonatex/sonatextiles.com.ua/images/index_03.gif" alt="Сонатекстиль" width="193" height="163" align="right" /></div> </div><!-- #header--> CSS * { margin: 0; padding: 0; } html {height: 100%} body { font: 12px/18px Arial, Tahoma, Verdana, sans-serif; width: 100%; height: 100%; background-color:#FFF; } a { color: blue; outline: none; text-decoration: underline; } a:hover { text-decoration: none; } p {margin: 0 0 18px} img { border: none; } input {vertical-align: middle} #wrapper { width: 1000px; margin: 0 auto; min-height: 100%; height: auto !important; height: 100%; } /* Header —————————————————————————--*/ #header { height: 163px; width: 1000px; } /* Middle —————————————————————————--*/ #middle { width: 100%; padding: 0 0 100px; height: 1%; } #middle:after { content: '.'; display: block; clear: both; visibility: hidden; height: 0; } #container { width: 100%; float: left; overflow: hidden; } #content { padding: 0 270px 0 270px; } /* Sidebar Left —————————————————————————--*/ .sl { float: left; width: 250px; margin-left: -100%; position: relative; background: #B5E3FF; } /* Sidebar Right —————————————————————————--*/ .sr { float: left; margin-right: -3px; width: 250px; margin-left: -250px; position: relative; background: #FFACAA; } /* Footer —————————————————————————--*/ #footer { width: 1000px; margin: -100px auto 0; height: 100px; background: #BFF08E; } /*——————header—————————--*/ #logo { width: 302; height: 163; } #logo1 { width: 505; height: 163; } #logo2 { width: 193; height: 163; Скрин: