Consigli per layout

[califfo]

Ragazzi ho bisogno dei vostri consigli.
Sto realizzando un sito, il primo in XTML e CSS, e volevo farvi qualche domanda prima di proseguire:

Il layout è molto semplice: 2 colonne, di cui quella dei contenuti liquida e quella del menu fissa ..
Allora:

1) Aprendo la pagina con Firefox la larghezza della finestra appare più stretta rispetto ad IE. Dov'è l'errore ?

2) Ci sono modi migliori per realizzare il layout ?

3) Ho messo prima i contenuti nel codice per via dell'accessibilità. E' corretto ?

La pagina di prova potete vederla qui: http://www.catechesi.com/prova.html

Grazie per i consigli .... Portate pazienza !!! Sto imparando piano piano !!!!!

[Mich_]

1. Dipende dal box model: in IE margini e border sono esterni all'area; nei browser conformi al W3C sono invece interni all'area definita dal width

2. Vedi i siti dove sono raccolti i layout ("link utili" di questo forum - sezione layout).

3. Puo` andare bene, ma non per questo devi necessariamente far andare il menu a destra.

Ecco alcune considerazioni:
A.
html,body { margin:5% 10% 10% 10%; ... }
In pratica l'area utile in larghezza sara` il 64% della finestra (togli il 20% dall'html e il 20% dal body).
Conviene mettere i margini ad uno solo (e comunque il 20% di margini sono una bella fetta: in caso di browser un po' stretti, limiti molto l'usabilita`

B.
<div id="wrapper">
<div id="content">
Perche` due div uno nell'altro (senza altri elementi dentro wrapper)? A che ti serve? Appesantisce inutilmente la pagina

C.
#sidebar { ... display: inline; }
Non ha molto senso: non e` unelemento da mettere inline: tra l'altro contiene elmenti di blocco, per cui e` un errore.
Per metterlo a destra hai gia` il float

[califfo]

Originariamente inviato da Mich_
1. Dipende dal box model: in IE margini e border sono esterni all'area; nei browser conformi al W3C sono invece interni all'area definita dal width

2. Vedi i siti dove sono raccolti i layout ("link utili" di questo forum - sezione layout).

3. Puo` andare bene, ma non per questo devi necessariamente far andare il menu a destra.

Ecco alcune considerazioni:
A.
html,body { margin:5% 10% 10% 10%; ... }
In pratica l'area utile in larghezza sara` il 64% della finestra (togli il 20% dall'html e il 20% dal body).
Conviene mettere i margini ad uno solo (e comunque il 20% di margini sono una bella fetta: in caso di browser un po' stretti, limiti molto l'usabilita`

B.
<div id="wrapper">
<div id="content">
Perche` due div uno nell'altro (senza altri elementi dentro wrapper)? A che ti serve? Appesantisce inutilmente la pagina

C.
#sidebar { ... display: inline; }
Non ha molto senso: non e` unelemento da mettere inline: tra l'altro contiene elmenti di blocco, per cui e` un errore.
Per metterlo a destra hai gia` il float

Innanzitutto grazie per le risposte ...

Allora per quanto riguarda margini e padding stasera faccio qualche prova ...
Per il layout darò un'occhiata ai link utili ...
Ho voluto mettere la barra volontariamente a destra così che l'occhio cade subito sui contenuti ...
Il layout l'ho realizzato basandomi su un articolo letto in Pro-Html. Effettivamente quel "wrapper" non mi convince ...

Farò delle prove e vi stresserò di nuovo ...grazie