-
Здравтвуйте, есть код
Код:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN""h ttp://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1251">
<title>Untitled Document</title>
<style>
#main {
width: 100%;
}
.header {
width: 100%;
height: 50px;
background: #36f;
}
.footer {
width: 100%;
height: 50px;
clear: both;
background: #006;
}
#content-columns {
margin: 0 150px 0 150px;
}
.content {
width: 100%;
float: left;
background: #ccc;
border:solid 1px #009900;
}
.leftcolumn {
width: 140px;
float: left;
margin-left: -145px;
display: inline; /* решает проблему в IE */
position: relative;
background-color:#006600;
}
.rightcolumn {
width: 140px;
float: right;
margin-right: -145px;
display: inline; /* решает проблему в IE */
position: relative;
background-color:#006600;
}
</style>
</head>
<body>
<div id="main">
* <div class="header">
* * * Верхушка
* </div>
* <div id="content-columns">
* * * <div class="leftcolumn">
* * * * * Левая колонка
* * * </div>
* * * <div class="content">
* * * * * Центральная колонка
* * * * * Центральная колонка
* * * * * Центральная колонка
* * * * * Центральная колонка
* * * * * Центральная колонка
* * * </div>
* * * <div class="rightcolumn">
* * * * *Правая колонка
* * * </div>
* </div>
* <div class="footer">
* * * Подвал
* </div>
</div>
</body>
</html>
Нужно что бы между левой/правой колонкой и центром был отступ в 5px, во всех браузерах норм, в IE6 отступа нет. В чем проблема? Как исправть?
Спасибо
P.S. при копировании кода в доктайп в http уберить пробел, ваш форум за спам принимал.
-
1. width: 100% совместно с border:solid 1px #009900 для блока content – изначально неверно.
2. Макрораскладка сама по себе вызывает сомнения. В частности, не рекомендуется впихивать невпихуемое. Все намного проще:
[Only registered and activated users can see links. Click Here To Register...]
-
ALL TO Aykroyd
Спасибо, но этот шаблон не совсем то что мне надо.
Я нашел еще один метод дивной верстки в 3 колонки (конечно для Вас он не нов). Вот собственно он.
Код:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "ht tp://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>div test</title>
<style type="text/css">
body {padding:0; margin:0;}
#left {float:left; width:150px; margin-left:10px; border:solid 1px #990000;}
#right {float:right; width:150px; margin-right:10px; border:solid 1px #990000;}
#center {border:solid 1px #990000; margin-left:172px; margin-right:172px;}
</style>
</head>
<body>
<div id="left"></div>
<div id="right"></div>
<div id="center"></div>
</body>
</html>
Отсюда возникают 3 вопроса:
1) Как Вы относитесь к такому методу дивной верстки.
2) Если для блока не указан width:100%; и есть border:solid 1px #009900; это изначально верно?
3) В IE возникла проблема, он не хочет делать отступ с лева и с права по 10px, а вместо того берет и прижимает боковые колонки к центру, хотя в других браузерах все норм. Как собственно поправить поправить не прибегая к добавлению еще одного блока.
P.S. <body> тоже трогать нельзя, т.к. на моем сайта данный не находиться напрямую в <body>.
P.S.2 при копировании кода в доктайп в http уберить пробел, ваш форум за спам принимал.
-
Цитата:
Originally posted by Deadly-@Jun 20 2008, 23:53
Я нашел еще один метод дивной верстки
Как Вы относитесь к такому методу дивной верстки.
<div align='right'>[Only registered and activated users can see links. Click Here To Register...]
[/quote]
Тот же ***, только вид сбоку.
Цитата:
Originally posted by Deadly-@Jun 20 2008, 23:53
2) Если для блока не указан width:100%; и есть border:solid 1px #009900; это изначально верно?
<div align='right'>[Only registered and activated users can see links. Click Here To Register...]
[/quote]
Изначально верно.
Цитата:
Originally posted by Deadly-@Jun 20 2008, 23:53
В IE возникла проблема, он не хочет делать отступ с лева и с права по 10px
<div align='right'>[Only registered and activated users can see links. Click Here To Register...]
[/quote]
#left {display: inline;}
#right {display: inline;}
-
Цитата:
Originally posted by Aykroyd@Jun 20 2008, 20:04
Тот же ***, только вид сбоку.
<div align='right'>[Only registered and activated users can see links. Click Here To Register...]
[/quote]
А каким Вы способом бы сверстали просто 3 (боковые фикс центер тянется) колонки с отступом от краев и между колонками в 10px?
Цитата:
Originally posted by Aykroyd@Jun 20 2008, 20:04
#left {display: inline;}
#right {display: inline;}
<div align='right'>[Only registered and activated users can see links. Click Here To Register...]
[/quote]
Помогло спасибо.
