Как сделать блок по центру?

Статус
В этой теме нельзя размещать новые ответы.

krasniy

Постоялец
Регистрация
21 Апр 2006
Сообщения
712
Реакции
113
Подскажите пожалуйста, почем div не отображается по центру страницы в IE, а в ФФ все пучком
HTML:
#header {
    height: 60px;
    width: 960px;
    margin: 0 auto;
    display: block;
    position:relative;
    }
 
Стиль правильный и все отображается нормально в IE6,IE7,IE8 - лично проверял.
 
<DIV id=header>
добавь align="center"
чтобы было <DIV id=header align="center">

заработает ))
 
не отображается по центру потому что нет доктайпа xhtml 1.0
 
та не. тут все ошиблись. надо что бы вышестоящий блок имел text-align:center.
напрмиер так:
HTML:
body {text-align:center;}
body div {margin:0 auto; text-align:left;}

<html>
<body>
<div>
</div>
</body>
</html>
 
align'aми и text-align центрировать блоки это пошло... Верное решение все же доктайп..
 
HTML:
#header {
    height: 60px;
    width: 960px;
    margin-left:auto;
    margin-right:auto;
    text-align:left;
    display: block;
    position:relative;
    }
 
<style>
body {text-align:center}

</style>
</head>
<body>

<div style="text-align:left;position:relative;top:40%;width:200px;height:20%;border:1px solid blue;padding:0px">
<div style="position:relative;top:3px;left:3px;width:50px;height:10%;border:1px solid red"></div>

Добавлено через 1 минуту
<style type="text/css">
#t {
background-color:#009999;
position: relative;
height: 400px

}


#in1 {
position: absolute;
top: 50%;
border: red dashed;
}
</style>


</head>

<body>
<div id="t" style="border:#999999 thick dashed">
<div id="in1"><p style=" position: relative; top: -50%; border:#0000FF dotted">
any text<br />
any height<br />
any content, for example generated from DB<br />
everything is vertically centered
</p></div>
</div>

Добавлено через 2 минуты
<style type="text/css">
<!--
* html body {
height: 100%; /* замена min-height:100% для IE6 */
margin: 0;
padding: 0;
}

body {
position: relative; /* абсолютно позиционируемые элементы
будут располагаться относительно body */
}

.wrap {
width: 100%;
display: table-cell;
vertical-align: middle;
height: 100%;
}
.inner {
margin-top: expression(((wrap.offsetHeight/2)
-parseInt(offsetHeight)/2) <0 ? "0" :
(wrap.offsetHeight/2)
-(parseInt(offsetHeight)/2) +'px')
margin-left: auto;
margin-right: auto;
margin-left: auto;
}
-->
</style>
</head>
<body>




<?php include("menu.html"); ?>

<div id="wrap" class="wrap">
<div id="inner" class="inner">Здесь располагается содержимое class "inner"lllllllllllllllllllllllllllllllllllllllllllllllllllllllllllllllllllllllllllllllllllllllllllllllllllllllllllllllllllllllllllllllllll</div>
</div>



<?php include("bottom.php"); ?>
</body>
 
А как сделать что бы блок был еще и по вертикальному центру?
 
Статус
В этой теме нельзя размещать новые ответы.
Назад
Сверху