[CSS]Centratura pagina

Psygnosis · 06-02-2007, 19:10

Ragazzi avrei bisogno di un modo di centrare tutta la pagina visualizzata nel browser al centro dello schermo come su QUESTO SITO ad esempio.
Vi ringrazio.
siccome la pagina l'ho gia creata ma non è centrata spero che basterà inserire il blocco in CSS e poi inserire tutto il body della pagina all'interno del DIV con l'id del blocco di centratura...

Ciao a tutti

MEMon · 06-02-2007, 21:33

Fai un div contenitore che contenga un div contenuto, al quale metti come regola margin:0px auto;
auto per il margine destro e sisnistro ha come conseguenza quella di centrare l'elemento nel suo contenitore, quindi centrarà il div contenenuto nel div contenitore.

andbin · 07-02-2007, 10:21

Quote:

Originariamente inviato da MEMon

Fai un div contenitore che contenga un div contenuto, al quale metti come regola margin:0px auto;

Il giochetto del margin left/right messo a 'auto' non funziona con tutti i browser, ad esempio con IE 5.5 non funziona.

Io per sicurezza ho sempre fatto così, ad esempio:

CSS

body { text-align: center; }
#content { margin: 0px auto; text-align: left; width: 400px; border: 1px solid black; }

HTML

<body>
<div id="content">
....
</div>
.....

MEMon · 07-02-2007, 10:24

Ah ok!
Già che ci sono ne approfitto anche io.
Ho un div che al suo interno contiene altri due div affiancati, uno a destra ed uno a sinistra, in modo da formare due colonne.
Per farlo gli metto la regola float:right e float:left.
Il problema è che se al div che li contiene non impongo un'altezza esso risulta essere di altezza nulla con firefox, come mai?
Con IE invece si adegua alla dimensione del suo contenuto.

andbin · 07-02-2007, 10:30

Quote:

Originariamente inviato da MEMon

Ah ok!
Già che ci sono ne approfitto anche io.
Ho un div che al suo interno contiene altri due div affiancati, uno a destra ed uno a sinistra, in modo da formare due colonne.
Per farlo gli metto la regola float:right e float:left.
Il problema è che se al div che li contiene non impongo un'altezza esso risulta essere di altezza nulla con firefox, come mai?
Con IE invece si adegua alla dimensione del suo contenuto.

Prova questa paginetta:

Codice:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<title>Prova</title>
<style type="text/css">
<!--
#content { width: 400px; border: 1px solid black; }
#content_l { float: left; border: 1px solid red; }
#content_r { float: right; border: 1px solid blue; }
-->
</style>
</head>
<body>

<div id="content">
<div id="content_l">
DIV sinistro<br><br><br><br><br><br><br>
</div>
<div id="content_r">
DIV destro<br><br><br><br>
</div>
<div style="clear: both"></div>
</div>

</body>
</html>

MEMon · 07-02-2007, 10:34

Funziona, ma è come l'ho impostata anche io...allora il problema è un'altro.

MEMon · 07-02-2007, 10:49

risolto c'era un tag </div> che si era perso

06-02-2007, 19:10	#1
Psygnosis Senior Member Iscritto dal: Jun 2005 Città: Nella casella Layer di Photoshop Messaggi: 737	[CSS]Centratura pagina Ragazzi avrei bisogno di un modo di centrare tutta la pagina visualizzata nel browser al centro dello schermo come su QUESTO SITO ad esempio. Vi ringrazio. siccome la pagina l'ho gia creata ma non è centrata spero che basterà inserire il blocco in CSS e poi inserire tutto il body della pagina all'interno del DIV con l'id del blocco di centratura... Ciao a tutti

06-02-2007, 21:33	#2
MEMon Senior Member Iscritto dal: Dec 2002 Messaggi: 3359	Fai un div contenitore che contenga un div contenuto, al quale metti come regola margin:0px auto; auto per il margine destro e sisnistro ha come conseguenza quella di centrare l'elemento nel suo contenitore, quindi centrarà il div contenenuto nel div contenitore.

07-02-2007, 10:24	#4
MEMon Senior Member Iscritto dal: Dec 2002 Messaggi: 3359	Ah ok! Già che ci sono ne approfitto anche io. Ho un div che al suo interno contiene altri due div affiancati, uno a destra ed uno a sinistra, in modo da formare due colonne. Per farlo gli metto la regola float:right e float:left. Il problema è che se al div che li contiene non impongo un'altezza esso risulta essere di altezza nulla con firefox, come mai? Con IE invece si adegua alla dimensione del suo contenuto.

07-02-2007, 10:34	#6
MEMon Senior Member Iscritto dal: Dec 2002 Messaggi: 3359	Funziona, ma è come l'ho impostata anche io...allora il problema è un'altro.

07-02-2007, 10:49	#7
MEMon Senior Member Iscritto dal: Dec 2002 Messaggi: 3359	risolto c'era un tag </div> che si era perso

Strumenti
Mostra una versione stampabile Invia questa pagina per email