Поиогите разобраться с в?рсткой

Юрий · November 12, 2007

Как сделать чтобы слой id="direct" отображался внизу рубрикатора, а не под ним.

В IE отображается как мне надо. Подскажите в ч?м ошибка. И как можно улучшить код?

<!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="en">

 <head>
 <meta http-equiv="content-type" content="text/html; charset=windows-1251" />


 <style type="text/css">

 #nov_level1 {
 margin: 2px 20px 0 190px;
 position: relative;
 }

 #nov_level2 {
 background: #f0f0f0 url('../images/ug_lb.gif') no-repeat bottom left;
 float: left;
 width: 100%;
 }

 #nov_level3 {

 float: left;
 width: 100%;
 background: url('../images/ug_rb.gif') no-repeat bottom right;
 padding-bottom: 5px;
 }



 /* навигатор */
 .arrow {
 font: 900 16px Arial;
 margin: 0;
 color: #000;
 }


 .dir {
 font: normal 13px Arial;
 margin: 0 0 5px 0;
 padding: 6px 0 6px 8px;
 border-bottom: 1px solid #fff;
 background: #F4F4F4;

 }

 .dir a {
 color: #0000CC;
 }

 .dir a:hover {
 color: #c60000;
 }


 #id_rub {
 background: #D0D0D0;
 padding: 3px 3px 4px 3px;
 margin: 0;
 color: #000;
 }



 .colon {
 width: 33.3%;
 float: left;
 padding: 2px 0 2px 0;
 }

 .colon a {
 font: normal 13px arial;
 color: #0000CC;
 margin: 0 0 0 8px;
 }

 .colon a:hover {
 color: #c60000;
 }


 .vsego {
 padding-left: 5px;
 font: normal 11px tahoma;
 color: #707070
 }

 #direct {
 margin: 0px 5px 5px 170px;
 font: normal 11px Arial;
 background: #ccc;
 padding: 10px 0 0 0;
 }

 </style>

</head>

<body>
 <div id="nov_level1">
 <div id="nov_level2">
 <div id="nov_level3">

 <p class="dir"><a href="index.php">E-VL.RU</a> <span class="arrow">→</span> <span id="id_rub">Авто, мото</span></p>

<div class="colon"><a href=?id=1⊂=1>Продажа авто</a><span class=vsego>(202)</span></div>
<div class="colon"><a href=?id=1⊂=2>Покупка авто</a><span class=vsego>(5)</span></div>
<div class="colon"><a href=?id=1⊂=3>ПТС и документы</a><span class=vsego>(81)</span></div>

<div class="colon"><a href=?id=1⊂=4>Продажа запчастей</a><span class=vsego>(35)</span></div>
<div class="colon"><a href=?id=1⊂=5>Покупка запчастей</a><span class=vsego>(10)</span></div>
<div class="colon"><a href=?id=1⊂=6>Автосервисы</a><span class=vsego>(10)</span></div>
<div class="colon"><a href=?id=1⊂=7>Автошины</a><span class=vsego>(12)</span></div>
<div class="colon"><a href=?id=1⊂=8>Спецтехника</a><span class=vsego>(69)</span></div>
<div class="colon"><a href=?id=1⊂=9>Водная техника</a><span class=vsego>(16)</span></div>

<div class="colon"><a href=?id=1⊂=10>Мото</a><span class=vsego>(21)</span></div>
<div class="colon"><a href=?id=1⊂=11>Масла и смазки</a><span class=vsego>(4)</span></div>
<div class="colon"><a href=?id=1⊂=12>Разное</a><span class=vsego>(66)</span></div>

 </div></div></div>

 <div id="direct">
 Ниже рубрикатора
 </div>

</body>

</html>

Scrum · November 12, 2007

clear:both; для id="direct"

Юрий · November 12, 2007

Спасибо. Как-то я это свойство упустил

Sign In

Поиогите разобраться с в?рсткой

Question

Юрий

Link to comment

Share on other sites

2 answers to this question

Recommended Posts

Scrum

Link to comment

Share on other sites

Юрий

Link to comment

Share on other sites

Join the conversation

Обсуждения

Forums

Important Information