Как отцентровать дивы?

laradice · October 29, 2008

Здравствуйте.

Вопрос такой. Есть код:

<body>
		<div class="center">
				<div class="block"></div>
				<div class="block"></div>
				<div class="block"></div>
				<div class="block"></div>
				<div class="block"></div>
				<div class="block"></div>
				<div class="block"></div>
				<div class="block"></div>
				<div class="block"></div>
		</div>
</body>

И CSS к нему:

body {
	margin: 0;
	padding: 0;
	font-family: Arial;
	line-height: 25px;
	background: #fff;}
.clear{clear:both;}
.center {
		width: 100%;}
.block {
		float:left;
		margin: 6px;
	width: 189px;
	height: 189px;
		background: #f00;}

Нужно чтобы блоги отображались по центру, а не были прибиты к левому краю.

Возможно ли такое и если да то как?!

e1f · October 29, 2008

А как именно надо по центру?

Можно центрировать сам внешний див относительно окна, скажем так:

.center {
	width: 80%;
	margin: 0 auto;
}

laradice · October 29, 2008

А как именно надо по центру?

Нужно чтобы внешний див (.center) был по центру, и ширина его желательна была бы равна сумме ширины внутрених дивов в строчке.

Можно центрировать сам внешний див относительно окна, скажем так:

В принципе так тоже не плохо, но, не работатет в IE.

user · October 29, 2008

align=center

laradice · October 30, 2008

align=center

все бы было хорошо, но это не табличная верстка

e1f · October 30, 2008

В принципе так тоже не плохо, но, не работатет в 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">
<head>
<style type="text/css">
body {
	margin: 0;
	padding: 0;
	font-family: Arial;
	line-height: 25px;
	background: #fff;
}
.center {
	width: 80%;
	margin: 0 auto;
}
.block {
	float:left;
	margin: 6px;
	width: 189px;
	height: 189px;
	background: #f00;
}
</style>
</head>
<body>
  <div class="center">
	<div class="block"></div>
	<div class="block"></div>
	<div class="block"></div>
	<div class="block"></div>
	<div class="block"></div>
	<div class="block"></div>
	<div class="block"></div>
	<div class="block"></div>
	<div class="block"></div>
  </div>
</body>

Edited October 30, 2008 by e1f

laradice · October 30, 2008

Поставь доктайп.

Точно! Большое спасибо!

Sign In

Как отцентровать дивы?

Question

laradice

Link to comment

Share on other sites

6 answers to this question

Recommended Posts

e1f

Link to comment

Share on other sites

laradice

Link to comment

Share on other sites

user

Link to comment

Share on other sites

laradice

Link to comment

Share on other sites

e1f

Link to comment

Share on other sites

laradice

Link to comment

Share on other sites

Join the conversation

Обсуждения

Forums

Important Information