div

MefistofeleS · November 7, 2010

Возможно ли выровнять сам блок div по центру страницы а не только его содержимое по среди блока?

SCHNITZER · November 7, 2010

Если интересует выравнивание по центру ширины, тогда:

Предположим блок шириной 400, высотой 250. Цвет фона так, для проверки.

#xxx
	{
		display:block;
		width:400px;
		height:250px;
		position:relative;
		left:50%;
		margin-left:-200px;
		background:red;
}

А чтобы отцентрировать блок по середине страницы и сверху, и снизу, тут такая история:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html	lang="ru"	xml:lang="ru"	style="height:100%; width: 100%; overflow: auto; ">
<head>

<title> НАЗВАНИЕ СТРАНИЦЫ </title>	   

<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta http-equiv="Content-Script-Type" content="text/javascript"/>
<meta http-equiv="Content-Style-Type" content="text/css"/>
<meta name="Author" content="Site Author" />

<style type="text/css">			

BODY {
	height: 100%; 
	width: 100%;			
	}

#vvv {
	display:block;
	width:400px;
	height:250px;	   
	background:red;}

</style>

</head> 

<body>

<!--Содержимое по центру-->
<table height="100%" width='100%' align='center'><tr align='center'><td>

	<div id='vvv'></div>				  

<!--Содержимое по центру-->
</td></tr></table>   

</body> 
</html>

Обрати внимание на style="height:100%; width: 100%; overflow: auto;" у тега html, и height: 100%; width: 100%; у body.

Ответил на вопрос?

MefistofeleS · November 7, 2010

Большое спасибо) Интересовало как раз по ширине...т.к. не нашел в самоучителе и справочнике как сделать)

SCHNITZER · November 7, 2010

Пожалуйста

Serlutin · November 7, 2010

Извините, я возможно не совсем точно понял вопрос, но почему нельзя воспользоваться

div {width:400px; margin: 0 auto;}

Edited November 7, 2010 by Serlutin

Sign In

div

Question

MefistofeleS

Link to comment

Share on other sites

4 answers to this question

Recommended Posts

SCHNITZER

Link to comment

Share on other sites

MefistofeleS

Link to comment

Share on other sites

SCHNITZER

Link to comment

Share on other sites

Serlutin

Link to comment

Share on other sites

Join the conversation

Обсуждения

Forums

Important Information