Div con bordi: conta della lunghezza totale..

[Zulkifar2]

Sto diventando scemo..
In "mio sito di prova" ho un problema con Firefox.
L'ultima pseudo tabella che vedete (quella con la scritta "Ciao" a sinistra) sfora le dimensioni di larghezza consentite se vista con FireFox. Con Opera e Explorer invece tutta la tabella è contenuta in una sola riga come vorrei.
Mi pare sia un problema di bordi: FireFox li conta sommandoli alle dimensioni dei tre div che formano le celle (1+50+1+550+1+124+1=728px su 724px disponibili), gli altri browsers invece comprendono nelle dimensioni dei div anche i bordi(50+550+124=724px su 724px disponibili).
Come risolvo il problema?
I css li trovate Qui.
Grazie

[serialkiller]

un metodo..anche se non è il massimo è dare le 2 dimensioni

widht:200px !important; //firefox
width:202px;//IE

[Zulkifar2]

Se apro la pagina con Opera la soluzione che mi suggerisci non funziona..
Dici che questo metodo non è il massimo. Qual'è il metodo a norma per essere sicuri che funzioni con tutti i browsers?

Grazie per l'aiuto serialkiller

[serialkiller]

Originariamente inviato da Zulkifar2
Se apro la pagina con Opera la soluzione che mi suggerisci non funziona..
Dici che questo metodo non è il massimo. Qual'è il metodo a norma per essere sicuri che funzioni con tutti i browsers?

Grazie per l'aiuto serialkiller

a grandi linee dovrebe funzionare come ti ho detto prima perchè purtroppo ci sono queste disuguaglianze ed è il solito problema di box model, qui trovi una discussione sul caso

http://forum.html.it/forum/showthrea...58#post8611558

o con una ricerca su box model trovi tanto altro materiale

per quanto riguarda "!important" per quanto ne so io, non è consogliatissimo, solo quello

[dera]

La spiegazione del problema è la seguente: i browser che supportano correttamente i CSS (FF e Opera) visualizzano la somma delle dimensioni di un div+il suo bordo+eventuale padding, come dici giustamente tu. Purtroppo, come al solito, IE funziona per conto suo come hai notato, cioè lasciando la misura del div e restringendo il contenuto in base a quella. L'unico sistema per risolvere è quello consigliato da serialkiller... almeno fino a quando non uscirà un IE che supporti a pieno i CSS :maLOL:

[Zulkifar2]

Dici che FF e Opera interpretano alla stessa maniera le dimansioni di div padding e bordi..
Io ho FF 1.0.7 e Opera 8.5 e non danno lo stesso risultato per la pagina in questione:

Questa

Quindi o hai sbagliato affermazione o ho commesso qualche errore nel codice. Quale delle due? :master: :master:

[serialkiller]

Originariamente inviato da Zulkifar2
Dici che FF e Opera interpretano alla stessa maniera le dimansioni di div padding e bordi..
Io ho FF 1.0.7 e Opera 8.5 e non danno lo stesso risultato per la pagina in questione:

Questa

Quindi o hai sbagliato affermazione o ho commesso qualche errore nel codice. Quale delle due? :master: :master:

opterei per la seconda cosa, nche perchè proprio in questi giorni sto finendo un sito nel quale mi è toccato utilizzare proprio questo metodo e funziona perfettamente su IE6, FF 1.0.7, Opera 8.5, safari 2.0, Mozilla 1.7.8, Epiphany 1.4.8, Galeon 1.3.20 e Konqueror 3.3

[Zulkifar2]

Ho preso il mio foglio di stile e ho cambiato lo spessore dei bordi ai div incriminati.
FF somma la dimensione del div alla larghezza dei bordi. Quindi se aumento lo spessore dei bordi aumenta la larghezza totale dei div e me li manda a capo. E questo ok.
Opera invece lascia invariate le dimensioni totali; inspessisce i bordi restringendo lo spazio interno del div.



Non ci capisco più niente

[Zulkifar2]

Opera fa questo perchè è in quirk mode mi sembra di capire...
Dite che possa essere utile usare un doctype per risolvere la questione?

[Zulkifar2]

up!! (nenche un lettura da consigliare?)