comatibilità fra browser e centratura uguale per tutti [importante!!]

[Certe Notti]

salve a tutti,

dunque sto sviluppando il layout della homepage del mio sito e purtroppo incorro sempre e comunque in un errore legato alla centratura della struttura rispetto alla pagina e a seconda del browser.

http://www.ro76.it/homepage-css1.asp

questa soluzione prevede che tutte le aree siano con poszionamento rispetto ad un punto di partenza pari a 10px su una struttura la cui larghezza massima è di 780px.
Su Firefox, mozilla e netscape la centratura riesce perfettamente rispetto alla struttura ma non rispetto alla pagina, mentre su explorer da il risultato che tutti potete vedere.

A questo punto io cosa ho provato a fare?
invece che posizionare a 10 come punto di partenza ho provato a poszionare a -380px ossia la metà della larghezza della struttura più i 10px di bordo e il risultato è stato quello che risultava perfettamente centrata su explorer ma mi veniva sfasata in senso contrario alla'lta pagina su FF, Mozilla e Net.

http://www.ro76.it/homepage-css.asp

ragazzi che faccio per dar luogo ad una struttura centrata che possa coesistere su tutti i browser senza sacrifici di alcuno?

[Iena87]

devi inserire nel css, un text-align:center per il body

[Certe Notti]

Originariamente inviato da Iena87
devi inserire nel css, un text-align:center per il body

ma c'è in entrambi i casi, parlo al prulare perchè i 2 esempi sono legati a 2 css differenti, il body ha un allineamento centrale

body {
background-color:#98b4c1;
text-align: center;
}

io la butto lì poi voi suggerite ma se io creassi una tabella in modo tale da avere la cella centrale di 780px e poi sviluppo il tutto dentro questa cella tenendo l'allineamento a sinistra a questo punto?

[colde]

Originariamente inviato da Certe Notti
ma c'è in entrambi i casi, parlo al prulare perchè i 2 esempi sono legati a 2 css differenti, il body ha un allineamento centrale

body {
background-color:#98b4c1;
text-align: center;
}

io la butto lì poi voi suggerite ma se io creassi una tabella in modo tale da avere la cella centrale di 780px e poi sviluppo il tutto dentro questa cella tenendo l'allineamento a sinistra a questo punto?

nononono denielsan
niente tabella!

Con text-align: center fai quello che ti serve e rimane centrato su tutti i browser. Se con quella istruzione hai dei problemi non dipende dai browser (in parte) ma dipende da qualche altro errore, magari un margin troppo lungo, magari un float o chissà. Secondo me dovresti fare le cose per gradi:

commenti tutti i tag html, dopodiche uno alla volta lo analizzi togliendo il commento e vedi se fa quello che vuoi tu, eventualmente modificando il css.

Il problema che hai non è causa di alcun baco di IE, sicuramente è un errore tuo.
Altra cosa che consiglio, per verificare le giuste posizioni dei box, border, margin e padding ti conviene colorare le varie parti (usa il background-color) e li vedi a che punto finiscono.

[Certe Notti]

Originariamente inviato da colde
nononono denielsan
niente tabella!

Con text-align: center fai quello che ti serve e rimane centrato su tutti i browser. Se con quella istruzione hai dei problemi non dipende dai browser (in parte) ma dipende da qualche altro errore, magari un margin troppo lungo, magari un float o chissà. Secondo me dovresti fare le cose per gradi:

commenti tutti i tag html, dopodiche uno alla volta lo analizzi togliendo il commento e vedi se fa quello che vuoi tu, eventualmente modificando il css.

Il problema che hai non è causa di alcun baco di IE, sicuramente è un errore tuo.
Altra cosa che consiglio, per verificare le giuste posizioni dei box, border, margin e padding ti conviene colorare le varie parti (usa il background-color) e li vedi a che punto finiscono.

ma maestro miaghi ho idea che col colpo della gru (text-align) ci facciamo il brodino... ma provo a vedere come dice lei maestro...

[Certe Notti]

dunquesi.. diciamo che fra le 2 pagine sopra proposte

http://www.ro76.it/homepage-css.asp

è quella più riavvicinabile alla situazione tipo poiche sotto IE funziona correttamente mentre da errore sotto FF, Mozzilla e Netscape.
detto questo valutando ciò che mi provoca l'errore si nota che l'errore cade sempre in quelle parti di pagina composte da più blocchi uno affiancato all'altro.
Da qui logica deduzione che abbia cannato qualcosa nella composizione di queste parti.
Ed ecco che mi ricollego all'esempio:

http://www.html.it/elevata_accessibi...ibilita_16.htm

da cui ho preso spunto per creare le aree con più elementi affiancati ed infatti facendo riferimento a quella pagina ho ricreato per esempio la riga che comprende barra di navigazione e datario in questo modo:

foglio css

.rigablustart {height: 20px;
   width: 780px;
   background-color: #3c5f84;
   margin-left: 0px}  
  
#rigablu {position: absolute}
	
#navigator {position: absolute;
  top:0px;
  left: -390px;
  width: 600px}	
	
#timezone {position: absolute;
  top:0px;
  left: 200px;
  width: 180px}	
	
.orologio {width:170px;
  height: 20px;
  line-height: 20px;
  background-color: #3c5f84;
  left: 600px; 
  margin-right: 10px; 
  font-family: Verdana;
  font-size: 10px;
  color: #ffffff;
  text-align: right}	

.paginacorrente {width:600px;
  height: 20px;
  line-height: 20px;
  background-color: #3c5f84;
  left: 10px;
  margin-left: 10px;
  font-family: Verdana;
  font-size: 10px;
  color: #ffffff;
  text-align: left}

nella pagina html

  <div class="rigablustart"> 
    <div id="rigablu"> 
      <div id="navigator"> 
        <div class="paginacorrente">Siete in: Homepage</div>
      </div>
      <div id="timezone"> 
        <div class="orologio"> 
          <script type="text/javascript">
			var RightNow = new Date();
			var mon = RightNow.getMonth() + 1;
			var date = RightNow.getDate();
			var day = RightNow.getDay();
			var zday=new Array(7)
			if (day==0) {zday="Domenica"};
			if (day==1) {zday="Lunedì"};
			if (day==2) {zday="Martedì"};
			if (day==3) {zday="Mercoledì"};
			if (day==4) {zday="Giovedì"};
			if (day==5) {zday="Venerdì"};
			if (day==6) {zday="Sabato"};
			var zmon = new Array(12)
			if (mon==1) {zmon="Gennaio"};
			if (mon==2) {zmon="Febbraio"};
			if (mon==3) {zmon="Marzo"};
			if (mon==4) {zmon="Aprile"};
			if (mon==5) {zmon="Maggio"};
			if (mon==6) {zmon="Giugno"};
			if (mon==7) {zmon="Luglio"};
			if (mon==8) {zmon="Agosto"};
			if (mon==9) {zmon="Settembre"};
			if (mon==10) {zmon="Ottobre"};
			if (mon==11) {zmon="Novembre"};
			if (mon==12) {zmon="Dicembre"};
			
			document.write(""+zday+" "+date+" "+zmon+" ");
		  </script>
        </div>
      </div>
    </div>
  </div>

a questo punto cos'è che sbaglio e che ripeto come errore in tutte quelle parti composte al punto da saltare sui browser derivanti da netscape?

Grazie

[colde]

Mah, così è un po dura capire dove possa essere l'errore, almeno per me. A parte questo, vedo che usi i px mentre io avrei usato le percentuali in modo da avere il layout elastico; impopsti il body al 100% di larghezza con un bel text-align center e poi crei un box principale che contenga tutto il resto. Questo box principale rimarrà al centro della pagina.

Una volta creata questa struttura, allora ricominci la creazione del resto dei box, prendendo le varie parti che hai già creato ma inserendole poco alla volta e continuando a fare i controlli sui due browser. Appena trovi comportamenti diversi, sai che l'errore è in quel determinato box e inizi a fare le modifiche e provare altri sistemi di posizionamento.
Io però userei solo dimensioni in percentuale per i box e per i testi in em.

[Certe Notti]

Originariamente inviato da colde
Mah, così è un po dura capire dove possa essere l'errore, almeno per me. A parte questo, vedo che usi i px mentre io avrei usato le percentuali in modo da avere il layout elastico; impopsti il body al 100% di larghezza con un bel text-align center e poi crei un box principale che contenga tutto il resto. Questo box principale rimarrà al centro della pagina.

Una volta creata questa struttura, allora ricominci la creazione del resto dei box, prendendo le varie parti che hai già creato ma inserendole poco alla volta e continuando a fare i controlli sui due browser. Appena trovi comportamenti diversi, sai che l'errore è in quel determinato box e inizi a fare le modifiche e provare altri sistemi di posizionamento.
Io però userei solo dimensioni in percentuale per i box e per i testi in em.

calma io ho già determinato che le problematiche sono su quelle parti di struttura composte da più aree affinacate, il problema e che seguendo gli esempi trovati su html.it la morale diventa o così o pomì visto che mi viene proposta solo quella soluzione per creare quel tipo di struttura... e visto che io non sono un mago dei fogli di stile e del linguaggio xhtml ovvio che non vedo alternative che per gente più esperta sono ovvie...

[Certe Notti]

ebbene ho fatto come mi è stato consigliato ossia di togliere tutto il codice e arrivare a lasciare soltanto fino a quello che per primo presenti il problema ed infatti:

http://www.ro76.it/homepage-css1.asp

è la risultante ma siamo punto e a capo, ossia che su IE da un esito presso che positivo mentre sugli altri browser lascia molto a desiderare.
Ora visto che io non so che altro posso fare per risolvere questo problema spero che qualcuno riesca a capire e a dirmi da cosa è dipeso, da principiante del linguaggio xhtml e dei fogli di stile, sono sempre stato un seguace delle tabelle però posso anche aggiungere che se questa è l'accessibilità dei css della serie che su browser diversi da esiti diversi andiamo bene....

[andrea.paiola]

Originariamente inviato da Certe Notti
ebbene ho fatto come mi è stato consigliato ossia di togliere tutto il codice e arrivare a lasciare soltanto fino a quello che per primo presenti il problema ed infatti:

http://www.ro76.it/homepage-css1.asp

è la risultante ma siamo punto e a capo, ossia che su IE da un esito presso che positivo mentre sugli altri browser lascia molto a desiderare.
Ora visto che io non so che altro posso fare per risolvere questo problema spero che qualcuno riesca a capire e a dirmi da cosa è dipeso, da principiante del linguaggio xhtml e dei fogli di stile, sono sempre stato un seguace delle tabelle però posso anche aggiungere che se questa è l'accessibilità dei css della serie che su browser diversi da esiti diversi andiamo bene....

i CSS danno problemi perchè i browsers non li supportano adeguatamente... comunque: sistema per firefox (che è il browser che li gestisce meglio, ossia il più vicino agli standard) e poi aggiustiamo per gli altri con hacks e trucchetti vari