PDA

View Full Version : [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 (http://www.rtrsports.com/index.php) 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
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
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:
<!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 :D