[mozilla] margin-bottom werkt niet (goed)

[chris]

Hi, ik ben bezig met een remake van m'n site, en ik stuit op een (laatste?) probleem.

Zoals je hier kan zien, staan die twee blokjes tekst met plaatje perfect, behalve dat ik er geen witruimte tussen krijg in mozilla. in Opera doet ie perfect wat ik wil, maar in Mozilla (Firebird) staan die twee blokjes tegen elkaar aan.

In IE is de layout van het contents-gedeelte helemaal upgefucked, weet nog niet hoe ik dat ga oplossen.

de code die ik gebruik om een margin tussen die twee 'blokken' te krijgen, is het volgende:

Cascading Stylesheet:

#contents>div {
  margin-left: 99px;
  padding-top: 10px;
  width: 546px;
  margin-bottom: 10px;
}

die margin-bottom komt er dus in Mozilla niet door. Heeft iemand een idee hoe dit kan?

Linkjes:

html
css

[Verwijderd]

code:

margin:10px 0 10px 99px;

kan ook. Daarnaast: http://annevankesteren.nl...02/css-handling-of-margin

[chris]

Verwijderd schreef op 04 januari 2004 @ 22:58:

code:

margin:10px 0 10px 99px;

kan ook. Daarnaast: http://annevankesteren.nl...02/css-handling-of-margin

weet ik, maar helaas verandert dit niets aan mijn probleem. Het is alleen wat korter

[crisp]

je div class="left-item" en div class="right-item" rekken niet mee omdat ze feitelijk geen inhoud hebben (er staan floats in, maar geen daarvan heeft een clear property).
De reden dat het niet in IE werkt moge duidelijk zijn gezien de geringe ondersteuning in IE voor selectors

[chris]

crisp schreef op 04 januari 2004 @ 23:02:
je div class="left-item" en div class="right-item" rekken niet mee omdat ze feitelijk geen inhoud hebben (er staan floats in, maar geen daarvan heeft een clear property).

Aha! Maar zelfs als ik clears toevoeg dan doet ie nog niet zoveel, ik heb de nieuwe versie ff geupped. Kijk maar: klik.

De reden dat het niet in IE werkt moge duidelijk zijn gezien de geringe ondersteuning in IE voor selectors

[Verwijderd]

@chris, het ging meer om de 'daarnaast' uiteraard.

Nog een paar kleine dingen: http://www.pixy.cz/blogg/clanky/cssnopreloadrollovers/ en ooit gehoord van gestructureerde markup?

[Verwijderd]

'clear' heeft niks te doen op een property met 'float'. Dat moet dus op een property gezet worden met 'float:none;'.

@andre, waar zie je dat aan? Ik ken de typische tabellen comments, maar zijn er ook dat soort dingen voor CSS en zo? Ik zou het graag weten

[ Voor 47% gewijzigd door Verwijderd op 04-01-2004 23:16 ]

[André]

Verwijderd schreef op 04 januari 2004 @ 23:13:
en ooit gehoord van gestructureerde markup?

Anne: Zijn site is met MacroMedia Dreamweaver gemaakt, verwacht je dat dan

[chris]

Verwijderd schreef op 04 januari 2004 @ 23:13:
@chris, het ging meer om de 'daarnaast' uiteraard.

Ik zie het, ben nogal moe, ga maar 's slapen en morgen vrolijk verder!

Nog een paar kleine dingen: http://www.pixy.cz/blogg/clanky/cssnopreloadrollovers/ en ooit gehoord van gestructureerde markup?

Die preload-rollovers had ik gezien, maar vind ik eigenlijk een beetje een vieze oplossing.

Gestructureerde Markup
Ik vond eigenlijk dat mijn markup heel gestructureerd was nu! In ieder geval gestructureerder dan hiervoor. Tips en ideëen hoe het beter kan zijn uiteraard altijd welkom

edit:

André schreef op 04 januari 2004 @ 23:14:
[...]

Anne: Zijn site is met MacroMedia Dreamweaver gemaakt, verwacht je dat dan

Dat was de vorige! Als je toch niet met xhtml werkt, doe het dan maar met dreamweaver. Dat werkt voor zo'n site erg fijn, en het ziet er in nagenoeg alle grote browsers redelijk hetzelfde uit. Maar ik ben m'n leven aan het beteren, ik zet het niet voor niets om naar xhtml.

@Anne: hij bedoelt dus mijn huidige site.

[ Voor 32% gewijzigd door chris op 04-01-2004 23:23 ]

[chris]

Nou, het is gelukt!

ik heb dus door sommige elementen niet te laten floaten het geheel mooi werkend gekregen in Mozilla en Opera. Ook heb ik door het verbannen van de > selector het werkend gekregen in IE, met 1 vreemde uitzondering. De eerste div in m'n contents (met class="left-item") wil maar niet van de linkerkant af. Hij pakt de margin-left property niet, heeft iemand een idee/hint waarom er niet naar mijn CSS geluisterd wordt?

edit:

Laat maar, opeens werkte het wel? Misschien dat het aan de cache lag ofzo. Nou ja, in ieder geval hartstikke bedankt iedereen!

[ Voor 16% gewijzigd door chris op 05-01-2004 00:15 ]

[Verwijderd]

Ok, ik moet toegeven dat er veel vooruitgang is tussen je eerste en je tweede (gister niet naar die eerste gekeken). Het eerste probleem is dat je geen <ul id="nav"/> voor je menuutje gebruikt maar een DIV met een stel A elementen erin. Het tweede probleem is uiteraard de hoeveelheid DIVs, je kunt er dus zeker eentje weghalen voor het menu, maar wellicht moet het lukken om er nog meer weg te halen.

Ook gebruik je geen P voor het omvatten van je tekst. Ook het meermalig gebruik van H1 op 1 pagina ziet er niet echt goed uit (maar het is wel valid, dus daar moet je zelf maar even naar kijken).

Voor de rest is de broncode netjes, wellicht een paar <link rel="section"/> erin plaatsen?

Op het gebied van inhoud: zet nooit welkom neer! ;-)

[ Voor 5% gewijzigd door Verwijderd op 05-01-2004 08:24 ]

[chris]

Verwijderd schreef op 05 januari 2004 @ 08:23:
Ok, ik moet toegeven dat er veel vooruitgang is tussen je eerste en je tweede (gister niet naar die eerste gekeken). Het eerste probleem is dat je geen <ul id="nav"/> voor je menuutje gebruikt maar een DIV met een stel A elementen erin. Het tweede probleem is uiteraard de hoeveelheid DIVs, je kunt er dus zeker eentje weghalen voor het menu, maar wellicht moet het lukken om er nog meer weg te halen.

Ook gebruik je geen P voor het omvatten van je tekst. Ook het meermalig gebruik van H1 op 1 pagina ziet er niet echt goed uit (maar het is wel valid, dus daar moet je zelf maar even naar kijken).

Voor de rest is de broncode netjes, wellicht een paar <link rel="section"/> erin plaatsen?

Op het gebied van inhoud: zet nooit welkom neer! ;-)

Ik had het eerst met lists, maar dan kon je weer niet op de <a>'tjes klikken enzo, dus ik heb het nu zo gedaan, en het werkt. Ik was nog wel van plan om er in de toekomst naar te kijken.

P gebruiken voor het omvatten van de tekst is een goede, daar ga ik zo naar kijken. En ik gebruik zeker meerdere malen h1, misschien dat ik die <div id="header"> wel een h1 maak, en die kopjes h2, maar in principe vind ik het onzin om h2 te gebruiken als je geen h1 gebruikt.

Verder, bedankt voor de tips

[Verwijderd]

Dat is ook onzin. Maar dan moet je je afvragen of je wel de goede opbouw gebruikt qua inhoud.

[SWINX]

waarom gebruik je niet gewoon css-classes?
Dan hoef je ook niet met de h2 enzo te stoeien, die ook nog eens padding met zich meebrengen, dat is zooo irritant

[Rickets]

SWINX schreef op 05 januari 2004 @ 22:22:
waarom gebruik je niet gewoon css-classes?
Dan hoef je ook niet met de h2 enzo te stoeien, die ook nog eens padding met zich meebrengen, dat is zooo irritant

Dat is een kul-reden (om het zo maar eens te noemen) om je er makkelijk vanaf te doen. De padding kan je je aanpassen met css. En in veel gevallen is die padding juist wenselijk, aangezien het helpt bij het duidelijk maken van een titel.

[Verwijderd]

padding/margin e.d. dien je daarom ook atlijd zelf te definieren. Maar als je classes gaat gebruiken, tja, je wordt niet geindexeerd, je bent niet toegankelijk. Eigenlijk net of je ontwerpt voor Netscape4...