[CSS] Differente interpretazione dei bordi su IE, Opera e FF

[weppos]

Dunque, ci sarebbe un piccolo problema di fondo, non so se dipende dai browser o da me.

Sto cercando di arrivare ad utilizzare le classi di stile in modo più approfondito rispetto alle solite formattazioni.
A tal proposito ho una classe

#body_layout {
	border-left: 1px dashed #BCBBBF;
	border-right: 1px dashed #BCBBBF;
	background-color: #F9F9F9; 
	width: 754px;
}

che mi crea il corpo del layout con i bordi tratteggiati.
Ora, il problema è che la larghezza dell'header con cui si andrà a fondere il body è 754 e se imposto a 754 la larghezza sia IE che Opera lavorano egregiamente, FF no invece, come se considerasse i bordi esterni al 754 (infatti per funzionare bene devo mettere 752 ma ovviamente al contrario IE e Opera non interpreteranno uguale).

Sono io che ne dimentico un pezzo o cosa?

PS. Allego un file per comprendere meglio il problema.

[pierofix]

IE non supporta correttamente il box model.

Guarda questa pagina:

- http://tantek.com/CSS/Examples/boxmodelhack.html



Saluti,
Piero.

[weppos]

Originariamente inviato da pierofix
IE non supporta correttamente il box model.

Guarda questa pagina:

- http://tantek.com/CSS/Examples/boxmodelhack.html



Saluti,
Piero.

Ma anche opera allora? :master:

[pierofix]

:master:

Non mi risulta.

[weppos]

Originariamente inviato da pierofix
:master:

Non mi risulta.

Yes.
Opera (7.5.x) e IE (6.0 SP1) lo interpretano 754 correttamente, o meglio, come l'header, mentre FF no.

Inoltre, non mi quadra una cosa.
Secondo l'articolo che hai postato a questo punto IE dovrebbe mostrare un box largo come la barra rossa, o cmq quelli che lo interpretano come interno, eppure sia con IE che con FF io lo vedo (come corretto) lungo quanto la barra blu.

[Marcolino's]

Nel tuo esempio, il box che hai disegnato è largo 754 pixel più due per i bordi (1 pixel per ogni bordo destro e sinistro), quindi in realtà 256 pixel.

IE non somma i bordi ma li sottrae, o meglio lo considera interno alla larghezza del box e questa è la differenza.
Anche qualche versione di opera ha questo problema, ma solo per i bordi, mentre non l'ha per il padding.

comunque segui questa pagina dove è molto ben spiegato:
http://www.constile.org/tutorial/IE5_box_model/

[weppos]

Stasera sono cotto.
Comincio con il ringraziare per l'info, ho messo la pagina nei bookmarks e domani do uno sguardo con calma.

La cosa che mi fa specie è che negli articoli ho sempre letto IE 5.0 mentre nel mio caso il test è su 6.0 SP1.

Vabbè, misteri di IE.
Grazie, buona serata.

[Mich_]

In alcuni casi IE e` coerente con se stesso (cioe` si porta dietro gli errori da una versione all'altra), in altri no.

La cosa e` aggravata dal fatto che se metti il DOCTYPE (standard mode), le versioni nuove seguono le indicazioni W3C; mentre se lo fai lavorare in quirk mode (senza DOCTYPE) le version nuove si comportano come le vecchie.

Ora non so se il problema dei bordi e padding rientra in questa categoria (in generale non mi occupo dei browser non standard), per cui prendi questa informazione con le dovute cautele.

[Jerry Masslo]

se fai le prove con ie6 e riscontri questo problema allora starai usando un doctype per cui ie6 va in quirk mode, come i suoi predecessori

controlla qui:

http://pro.html.it/articoli/id_312/i...pag_5/pag.html


in questo caso ti dovrebbe bastare l'uso di !important per servire codice diverso ai vari browser cioé:

#body_layout {
border-left: 1px dashed #BCBBBF;
border-right: 1px dashed #BCBBBF;
background-color: #F9F9F9;
width:752px!important;
width: 754px;
}

[weppos]

Il doctype è quello visibile a http://www.weppos.com/asp/
Sto facendo delle prove e confermo che anche Opera 7.x lo vede come IE, ovvero corretto solo a 754.