Impostare layout al centro della finestra del browser

**roberto.orgiu** · 10-04-2011, 10:12

Ciao a tutti,
ho iniziato ieri a studiare i CSS per un corso all'università e sto avendo seri problemi a centrare layout, tabelle e form rispetto alla finestra del browser. Ho provato di tutto, ma non riesco a farlo funzionare... Vi posto il codice della pagina che sto provando a realizzare, ma che puntualmente mi appare a sinistra. Spero che qualcuno mi possa aiutare perchè ci sto perdendo la speranza :-S

//stile.css

codice:

html,body{
	margin: 0;
	padding:0;
	height:100%;
	width:75%;
	text-align: center;
}
#container{
	height: auto;
	min-height: 100%;
	margin: 0px 0px 0px 0px;
	border: 0px none;
	text-align: center;
	font: 76% arial;
	position: relative;
	width: 100%;
}
#header,#footer{
	background-color: #000000;
	color: white;
	width: 100%;
}

#footer{
	position: absolute;
	bottom: 0;
}
:link,:visited,:active{
	color:white;
	text-decoration:none;
}
:hover{
	text-shadow: 2px 2px 2px #FFF;
	font-style:oblique;
}
h1{
	text-transform: uppercase;
	text-shadow: 2px 2px 2px #FFF, 1px 5px 3px #B5B5B3;
	letter-spacing: 6px;
}
#imghead{
	height: 88;
	width:351
}

//index.html

codice:

<html>
	<head>
		<link rel="stylesheet" type="text/css" href="stile.css">
		<title>Home page</title>
	</head>
	<body>
	<div id="container">
	<div id="header">
		[img]images/header.jpg[/img]
		<h1>lok'tar ogar!</h1>
	</div>
	<div id="navigation"></div>
	<div id="content">
		<div id="content_header"></div>
	</div>
	<div id="footer">
		Official WebSite |
		
	</div>
	</div>
	</body>
</html>

**peppe79** · 10-04-2011, 12:35

...prova così...

codice:

<html> <head> <title>prova prova</title> <style type="text/css"> html,body{ 	margin: 0; 	padding:0; 	height:100%; 	text-align: center; } #container{ 	height: auto; 	min-height: 100%; 	margin: auto; 	border: 0px none; 	text-align: center; 	font: 76% arial; 	position: relative; 	width: 980px; } #header,#footer{ 	background-color: #000000; 	color: white; 	width: 100%; }  #footer{ 	position: absolute; 	bottom: 0; } :link,:visited,:active{ 	color:white; 	text-decoration:none; } :hover{ 	text-shadow: 2px 2px 2px #FFF; 	font-style:oblique; } h1{ 	text-transform: uppercase; 	text-shadow: 2px 2px 2px #FFF, 1px 5px 3px #B5B5B3; 	letter-spacing: 6px; } #imghead{ 	height: 88; 	width:351 } </style> </head>  <body> <div id="container"> 	<div id="header"> 		[img]images/header.jpg[/img] 		<h1>lok'tar ogar!</h1> 	</div> 	<div id="navigation"></div> 	<div id="content"> 		<div id="content_header"></div> 	</div> 	<div id="footer"> 		Official WebSite | 		 	</div> 	</div> </body> </html>

Discussione: Impostare layout al centro della finestra del browser

Strumenti discussione

Ricerca discussione

Visualizza

Impostare layout al centro della finestra del browser

Permessi di invio