[CSS] Verschil tussen firefox 2 en internet explorer 7

[Sjoerd]

ik ben bezig met een website te vinden op

Klik voor website
Klik voor css

Voor het eerst in mijn leven heb ik de moed gevonden om alles in CSS te gaan doen zodat de site er zowel in firefox als in IE er hetzelfde uitziet.

Nu het probleem, tot op de dag van vandaag dat ik met tabellen werkte was het altijd IE die lastig deed en niet Firefox tot nu...
In IE ziet de site er precies zo uit als ik wil maar in Firefox is het een kleine ramp, een balk wordt niet weer gegeven en ook onderaan zit er nogal wat marge verschil.
en dit terwijl de site xhtml strict valid is volgens dreamweaver (op wat leestekens na)

Heb al flink gerommeld met de css maar het wil maar niet lukken om de site in Firefox en IE hetzelfde te krijgen met behoud van layout.
dacht dat interpretatie van css nu toch wel op punt stond, zeker als het valid is

Waar gaat het fout in mijne css poging

[crisp]

Geef je #tekstscheidingbalk een height en geef #content #onderkant een clear:both in plaats van de margin-top.

Overigens is het Firefox die het juist doet; IE is nog zwaar buggy op het gebied van CSS...

Overigens zegt valid syntax niets over hoe het toegepast wordt. Syntax zelf bepaald geen gedrag. Het is hooguit dat fout gedrag veroorzaakt kan worden door invalid syntax, maar dat is hier niet van toepassing (hoewel XHTML syntax in HTML-mode wel invalid is).

Overigens: waarom geef je sommige elementen zowel een class als een id met dezelfde naam?

[ Voor 29% gewijzigd door crisp op 08-02-2007 14:02 ]

[Pendaco]

langezwieper schreef op donderdag 08 februari 2007 @ 13:50:
Waar gaat het fout in mijne css poging

Naar mijn idee al meteen in de basis.
Je geeft (in je bron) classes aan <div> elementen terwijl die helemaal niet zijn gedefinieerd in je css bestand. In je css staan namelijk alleen id's.

Even simpel uitgelegd;

class vb: .ikbeneenclass { }
id vb: #ikbeneenid { }

Verder is het niet echt gebruikelijk om constructies als dit te gebruiken;
#content #contentl {

Daarnaast zou je kunnen overwegen om de juiste elementen op de juiste plekken te gebruiken.
Je gebruikt nu; <span class="titelgroot" id="headerondertitel">slagzin</span> om je titel te stijlen terwijl je daar (vanuit semantisch oogpunt) beter een <H1></H1> element voor kunt gebruiken.

[Sjoerd]

crisp schreef op donderdag 08 februari 2007 @ 14:00:
Geef je #tekstscheidingbalk een height en geef #content #onderkant een clear:both in plaats van de margin-top.

Overigens is het Firefox die het juist doet; IE is nog zwaar buggy op het gebied van CSS...

Overigens zegt valid syntax niets over hoe het toegepast wordt. Syntax zelf bepaald geen gedrag. Het is hooguit dat fout gedrag veroorzaakt kan worden door invalid syntax, maar dat is hier niet van toepassing (hoewel XHTML syntax in HTML-mode wel invalid is).

Overigens: waarom geef je sommige elementen zowel een class als een id met dezelfde naam?

super dat werkt! Clear zei me nog niet zo veel tot vandaag

het feit dat ik alle elementen een id en class geef is eigenlijk meer gewoonte dan iets anders.
Is hier een nadeel aanverbonden? Vond het zelf altijd gewoon 'netjes' staan.

[Pendaco]

ID - unieke identificatie, komt op 1 enkele plek in je html voor, tenminste dat is de 'regel' vb; <div id="header"></div>

Class - verwijst naar een groep of klasse, dit element kan op meerdere plekken in je html gebruikt worden.

[ Voor 6% gewijzigd door Pendaco op 08-02-2007 14:15 ]