[CSS] Divisions

[Maks]

Ok, ik heb het volgende probleem:

http://www.teh-swah.nl/swah2

//edit Als ik de hoogte van de balken op 1px zet blijven ze in IE nog steeds even hoog. edit\\

Hier probeer ik een layoutje met divisions te maken. Nu heb ik het volgende. De blauwe balken zijn in firefox daadwerkelijk 8px maar in IE zijn ze veel groter...dit is mijn css:

Cascading Stylesheet:

body { 
            border: 0; 
               padding: 0; 
                    height: 96%; 
            background-color: #FFFFFF; 
            color: #000000; 
            text-align: center; 

    } 

table { 
            border-size: 0; 
            margin: 0; 
            padding: 0; 
            color: #000000; 
        } 
         
#werklaag { 
               width: 862px; 
                    height: 96%; 
                    margin: auto; 
                    margin-top: 30px; 
                    text-align: left; 
        } 

#upperbar { 
            position: relative; 
            top: 20px; 
            width: 862px; 
            height: 45px; 
            background-color: #292929; 
            background-image: url(upperbar.gif); 
        } 

                
#navigatie { 
            position: relative; 
            top: 20px; 
            height: 40px; 
            width: 862px; 
            background-color: #FFFFFF; 
        } 
#balknamenu { 
            position: relative; 
            height: 8px; 
            top: 20px; 
            width: 862px; 
            background-color: #00FFFF; 
            z-index: 3; 
          } 
#loginbox { 
            position: relative; 
            background-color: white; 
            height: 116px; 
            width: 250px; 
            top: -5px; 
            left: 0px; 
            z-index: 1; 
          } 
#banner { 
            position: relative; 
            height: 138px; 
            width: 862px; 
            top: 20px; 
            background-color: #FFFFFF; 
            background-image: url(http://www.teh-swah.nl/swah2/ban_log.gif); 
        } 
#balknabanner { 
            position: relative; 
            height: 8px; 
            top: 20px; 
            width: 862px; 
            background-color: #00FFFF; 
            } 
td.nav { 
            height: 40px; 
            background-color: #FFFFFF; 
            color: #292929; 
            text-align: center; 
            font-weight: bold; 
            font-family: sans-serif; 
            font-size: 13px; 
       } 
        
td.nav2 { 
            background-color: #292929; 
            color: #FFFFFF; 
            text-align: center; 
            font-weight: bold; 
            font-family: sans-serif; 
            font-size: 13px; 
        } 

[ Voor 45% gewijzigd door Maks op 16-04-2006 14:59 ]

[Vae Victis]

line-height

[Maks]

Uhh schitterend antwoord... maybe iets meer uitleg? want lineheight is als ik het zo zie niet echt wat ik zoek?

[R_W]

Zet de font-size 'ns op 6px oid.

[Maks]

Jaa! ty ty ty... daar was ik zelf echt niet op gekomen IE stinkt!

[Verwijderd]

Maksvr schreef op zondag 16 april 2006 @ 15:16:
Jaa! ty ty ty... daar was ik zelf echt niet op gekomen IE stinkt!

Ligt vaak aan een & nbsp; (aan elkaar) die nog in je code zit. IE ziet dus als tekst en de hoogte van je regel zal daarom niet kleiner worden.

Houd die stink opmerkingen over "IE stinkt" alstublieft voor je. Ga eens naar www.browsershots.org, vul je url in, wacht en bekijk het resultaat. IE en FF komen het beste uit de bus, de meeste 3e rangs browsers doen het veel slechter. Als "IE echt stinkt", onderbouw dan je argument!

[ Voor 4% gewijzigd door Verwijderd op 16-04-2006 16:19 ]

[crisp]

Verwijderd schreef op zondag 16 april 2006 @ 16:19:
[...]

Ligt vaak aan een & nbsp; (aan elkaar) die nog in je code zit. IE ziet dus als tekst en de hoogte van je regel zal daarom niet kleiner worden.

Houd die stink opmerkingen over "IE stinkt" alstublieft voor je. Ga eens naar www.browsershots.org, vul je url in, wacht en bekijk het resultaat. IE en FF komen het beste uit de bus, de meeste 3e rangs browsers doen het veel slechter. Als "IE echt stinkt", onderbouw dan je argument!

Ah, mag ik?

Wat IE doet is contra de specificaties; enkel whitespace binnen een layout-block dient ignored te worden en kan en mag dus geen height genereren. Dat ligt niet aan het gebruik van no-breaking spaces want dan zou ook Firefox height genereren (no-breaking space valt niet onder whitespace).

Dit is puur een bug van IE, zoals IE er zoveel heeft, en is op te lossen door bijvoorbeeld font-size/line-height kleiner in te stellen voor het betreffende element en/of overflow:hidden toe te passen.

Aan de andere kant kan de TS volgens mij beter borders gebruiken

[ Voor 4% gewijzigd door crisp op 16-04-2006 17:44 ]

[Verwijderd]

Uiteraard mag u, daarvoor is het een forum!

Specificaties? De w3c standaard, volgens mij kan Microsoft dat geen ruk schelen, wat uiteraard erg jammer is. Maar, om dan gelijk zonder enige argumenten te gaan schreeuwen dat IE stinkt, dat gaat er bij mij niet in.

Betekend niet dat andere browsers wel perfect zijn. Zoals safari op de volgende site (onderaan). Elke pagina werk de site perfect, werkt volgens de XHTML 1.0 Transitional en CSS standaard en toch doet Safari er rare dingen mee.

[XWB]

Betekend niet dat andere browsers wel perfect zijn.

Zeker niet, maar dat beweert toch ook niemand? Feit is wel dat IE een hele hoop gebreken heeft en dat zijn gewoon feiten. En zelf IE7 zal nog niet in de buurt van FF/Opera komen.