Newsgroup: it.lavoro.professioni.webmaster
Titolo: Problemi di posizionamento div

Ho creato una pagina che segue fedelmente le specifiche strict.dtd, ho
applicato i vari bottoni per il controllo xhtml e css
ho inserito solo div e nessuna tabella, non ho usato JavaScript ma solo
puro css, il tutto per finalmente ricevere un bel "complimenti!" da
w3org
Bella soddisfazione, però adesso il sito funziona solo se lo vedi con
Firefox se invece usi IE o altri simili come per esempio SlimBrowser i
div non sono posizionati regolarmente.
Ho dovuto inserire il bottone per ottenere Firefox, a la cosa non mi fa
particolarmente piacere, a me piace la libertà di scelta, anche se uno
preferisce l'odiato IE deve poterlo usare.
Ho il dubbio che sia meglio usare documenti di tipo "transitional"
piuttosto che tipo "strict"
Qualcuno ha avuto la stessa esperienza e può dare qualche dritta?
Il sito è all'indirizzo 
http://www.cdffmaputo.com/
Per osservare il contenuto della pagina css basta cliccare sul bottone
di controllo css

 piuttosto che tipo "strict"
Il problema non è il DTD che usi, ma più che altro come imposti markup e
css, explorer ha delle errate interpretazioni dei css che possono portare
a differenze di visualizzazione, ma niente che non sia documentato e
aggirabile.
A meno di non dover realizzare layout molto particolari si riesce ad avere
una resa quasi identica sulla maggior parte dei broswer validando il
documento come strict.
Non devi far altro che beccare questi errori e correggerli.
Partiamo dal doctype: quello che hai messo tu è corretto, ma il prologo
?xml, che non è obbligatorio, provoca diversi problemi anche, ma non
solo, a explorer 6. Per questo motivo ti conviene toglierlo, e specificare
la codifica nell' head del documento.
Questa è la prima cosa che mi è saltata in mente, non mi sono messo a
spulciare css e struttura del documento(è sempre domenica :D), quindi per
suggerimenti più precisi dovresti darci indicazioni più dettagliate
(quale versione di explorer ti da problemi, qual'è esattamente la
differenza di visualizzazione).
In linea di massima il problema più grave è quello dell' errata
interpretazione del box-model, che ti corregge applicando un apposito
hack, per i dettagli ti rimando a qualche lettura:
http://tantek.com/CSS/Examples/boxmodelhack.html
In realtà questo problema è di explorer 5.5 e non del 6, ma utilizzando
il prologo xml si verifica anche nella versione 6 (vado a memoria, non ho
controllato sui manuali, quindi non linciarmi se sbaglio).
Altra cosa che potrebbe darti problemi è la gestione dei margini negli
elementi float: se imposti un float left e un specifichi un margin-left
per un elemento, explorer raddoppierà quel margine, anche questo si
risolve con un trucchetto:
http://www.positioniseverything.net/explorer/doubled-margin.html
Per il resto non saprei che dirti, prova a sistemare alcune cose ed a
tornare con idicazioni più precise.
In ogni caso scorrendo al volo il tuo css ho notato che è molto
ridondante, molto più lungo di quel che potrebbe essere.
Se devi scrivere:
margin-top:0px;
margin-bottom:0px;
margin-left:0px;
margin-right:0px;
puoi tranquillamente sostituire tutte le 4 righe con:
margin:0px;
oppure con
margin:0;
risparmi banda, tempo, e hai meno righe in cui effettuare errori di
battitura.
Se devi specificare i 4 margini puoi sempre utilizzare
margin: 0px 5px 1px 0px;
tenendo conto che le misure si riferiscono rispettivamente a top right
bottom left.
Ciao
Francesco

 div non sono posizionati regolarmente.
Serva di lezione agli estremisti dello strict e del tableless.
Io il mio tempo lo investo in lavoro, non lo butto in autolesionistiche 
battaglie contro i mulini a vento.

grazie Francesco i tuoi commenti sono utilissimi.
Uso sempre un pò di ridondanza nel codice al fine di poterlo
modificare più comodamente se necessario. Come sai spesso i clienti
rompono le scatole per virgoline e millimetrici spostamenti.
Hai perfettamente ragione quando scrivi che il prologo ?xml non è
obbligatorio, la documentazione in rete non sempre lo consiglia,
occorre inserirlo nel tag meta. Però se lo tolgo il validator mi dà
errore e mi scrive beffardamente che non è un valido xhtml strict.
Sarei tentato di farne a meno, ma devo fare bella figura, si tratta di
un progetto importante finanziato dal governo italiano oltre che da
quello mozambicano e quindi soggetto ad una marea di critiche.
Non c'è domenica per un programmatore anche se le programmatrici la
pensano diversamente.
Ciao
Oreste


 pensano diversamente.
Proprio vero.
Ciao
Francesco

 battaglie contro i mulini a vento.
Premettendo che gli estremismi non fanno mai bene a nessuno, sei sicuro di
sapere di cosa stai parlando?
Non usiamo le nostre incapacità e mancanze professionali contro metodi
che portano dei vantaggi.
Se per te risparmiare mediamente il 50% di banda su una pagina *non*
utilizzando le tabelle per l'impaginazione è battaglia contro i mulini...
Se per te avere contenuti e presentazione separati è una battaglia contro
i mulini....
Se per te dare la possibilità ai navigatori che utilizzano browser
diverso dal tuo(come ad esempio cellulari, pda, screen reeder) di navigare
in maniera decente i contenuti del tuo sito è un optional va bene,
contentu tu.
Tutte le cose hanno pro e contro.
Ciao
Francesco

 non è un peccato troppo
Volevo dire "peccato mortale", peccato troppo non ha molto senso, era
decisamente troppo presto per scrivere. :D

Hai ragione, ho sostituito con il meta ed il documento risulta valido.
Lo avevo già fatto precedentemente ma probabilmente avevo dimenticato
di mettere l'end tag (troppo abituato al semplice html).
Sto studiando tutta la documentazione, in particolare i vari trucchi
hack per renderlo compatibile con le varie versioni IE, oltretutto ho
notato che si incasina anche con il browser Konqueror di Linux.
Se trovo una soluzione la posto immediatamente, chissà che non possa
essere utile anche ad altri colleghi.
Ciao
Oreste


 Oreste
Ciao
Francesco
PS cerca di fare attenzione al quoting

 
già che siamo in argomento approfitto per suggerire un'altra cosa.
Dato l'impaginazione particolare, e comunque contenuta, della prima
pagina, penso che avresi un risultato migliore centrando il box nella
pagina (sia verticalmente che orizzontalmente)
Solo un parere di natura estetica comunque
Ciao
Francesco

 Che difetto riscontri?
Non sovrappone completamente le immagini e non rispetta le posizioni
div.
Si, sulla centratura sono d'accordo, ho bisogno di fare dei test con pc
a bassa risoluzione prima, voglio evitare che appaiano barre di
scorrimento. Desidero risovere prima la compatibilità fra i vari
browser, purtroppo IE deve essere necessariamente in cima alla lista
perchè è ancora molto usato.
Ciao
Oreste