Newsgroup: it.comp.www.html
Titolo: Css centrare un blocco di testo con Explorer6

Ciao a tutti, proprio non capisco: ho il seguente codice preso da un esempio
di un libro sui css;
<html>
<head>
  <title>centered box set</title>
  <style type="text/css">
body {
  margin: 0px;
  padding: 0px;
  font-family: verdana, arial, helvetica, sans-serif;
  font-size: 12px;
  line-height: 22px;
  color: #000;
  background-color: #ccc;
  }
#content {
  padding: 10px;
  margin-top: 5px;
  margin-bottom: 5px;
  margin-right: auto;
  margin-left: auto;
  background-color: #fff;
  border: 1px solid #000;
  width: 70%;
  }
</style>
</head>
<body>
<div id="content">
Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy
nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat.
</div>
</body>
</html>
Ora questo codice dovrebbe a detta dell'autore centrare un blocco di testo
sulla pagina (il blocco peraltro dispone di un bordo); ho provato su
explorer 6 (Sp1) e il blocco mi si allinea a sinistra, non c'è modo di farlo
centrare. Se provo, invece su Opera 7 il blocco è perfettamente al centro.
Quello che non capisco è che l'autore utilizzava explorer, non so che
versione per i suoi esempi, eppure a lui si centrava.
Sapete darmi una mano, almeno a cambiare il codice per explorer?
Grazie E.L.

 centrare.
Cioč dichiarando "auto" per il margine destro e sinistro
lui si aspetta che IE assegni due valori uguali a destra e sinistra?
Mmm... io dico che per IE devi dichiarare text-align:center
nel primo "contenitore" disponibile, nel tuo caso puň essere il body,
oppure un div creato apposta:
<style type="text/css">
<!--
#main {text-align:center; width: 100%}
-->
</style>
<div id="main">
<div id="content">
Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy
nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat.
</div>
</div>
Cosě funziona.
(forse width:100% si puň anche eliminare...)
MaRoK

 MaRoK
Grazie anche io ero perplesso su auto, peraltro ho scoperto che l'autore del
libro (che fa piuttosto schifo sotto tutti i punti di vista) usa mozzilla,
probabilmente con quel browser dichiarando auto funziona (e funziona anche
con opera).
Sai consigliarmi qualche altro libro sull'argomento, quello dell'esempio č
CSS - Fogli di stile per il web di Briggs, Champeon, Costello e Patterson di
Hoepli, ma come ti ho detto non č molto chiaro.
Grazie ancora,
E.L.

 oppure un div creato apposta:
mmm, IMHO con IE6 dipende dal fatto che non c'e' sta
un doctype valido sulla pagina. (vi volete decidere
a metterci sti cazzo di doctype o no???)
vedi:
http://www.deelan.com/
il codice CSS del box con
il gatto e:
#content
{
	background: #dadada;
	margin: 10% auto;
 
	/* ... */			
	width: 430px;
}
margin: auto; provato con IE6 e mozilla
con IE5.x non funzia  devo trovare la voglia
di usare uno dei trucchi riportati piu' sotto
per gli sfigati che utilizzano IE5.
qui ci sono un paio di tecniche per centrare
orizzontalmente un elemento nella pagina
tenendo conto dei "deficit" di IE5:
Centering: Auto-width Margins (gia anticipata da marok)
http://bluerobot.com/web/css/center1.html
Centering: Negative Margin (stilosissima)
http://bluerobot.com/web/css/center2.html
su 
constile.org
 si e' estesa la seconda tecnica
per centrare un elemento sia in orizzontale che
in verticale:
http://www.constile.org/template/centrare_il_box/
buona lettura.
-- 
email: 
goldic...@yahoo.it
web: 
http://www.deelan.com


Hai perfettamente ragione, ma cacchio compro un libro a caro prezzo mi
carico gli esempi scaricati dal sito degli autori (aspettandomi che siano
aggiornati) e non mi funzionano con explorer6? Insomma non ci ho proprio
pensato al doctype...
Comunque funziona e grazie per l'aiuto. In ogni caso sconsiglio
assolutamente questo libro come pure tutti quelli pubblicati da Hoepli...
Ciao E.L.

 
http://www.constile.org/template/centrare_il_box/
WOW!
Gran bella pagina! Aggiunta ai preferiti! :D
A parte il caro, vecchio Netscape4, che ci mette del suo ad ogni refresh,
funziona praticamente su tutti i browser.
Tuttavia esiste una sola versione di Opera che manda tutto a puttane
ridimensionando la finestra. Ed è la 7.
Questo la dice lunga...
MaRoK

 assolutamente questo libro come pure tutti quelli pubblicati da Hoepli...
terremo presente.
se volete prendervi un libro sui CSS
compratevi quello di meyer "cascading styles sheet - the definitive
guide", oppure il piu' recente "meyer on CSS".
ciao.
-- 
goldicus1970 AT 
yahoo.it
http://www.deelan.com

 Questo la dice lunga...
hahahaha! attendiamo con
impazienza la 7.0.1 ^__^
bye


 oppure un div creato apposta:
Deelan ha già chiarito la cosa. Il problema, per maggiore completezza,
del DOCTYPE consiste nel fatto che, se non lo si mette, IE6 si
comporta come IE5 ed IE5 non supporta margin:auto che è il modo
corretto di fare le cose.
text-align:center è errato (ma necessario per IE5) per un ovvio
motivo: come dice il nome stesso della proprietà, text-align deve
agire *solo* sul testo, il fatto che su IE5 agisca anche sui box è uno
dei tanti errori dei browser Microsoft (ver 6 compresa).
Saluti