site in ie goed, firefox slecht

[Tha Ertenal]

Ik ben bezig met een site voor een kleine lan wat ik met wat vrienden organiseer, en zit nu een week op de layout te kutten. het gaan om de volgende site:

http://83.149.96.173/~ertenal/friendslan/index.php

Als je deze in internet explorer (hier 7, maar 6 pcies zelfde) bekijkt, zie je de layout goed. Het menu en het content zit netjes middenin, met die bliksem als achtergrond.

In firefox (nieuwste, en ook bon echo) wordt dat menu en content stuk links geplaatst.

Dus er moet een stukje code zijn lijkt mij wat wel werkt in iexplorer, en niet in firefox (of andersom), maar ik heb geen idee welke, aangezien ik niet veel met firefox werk.

Wat heb ik gedaan:
- Ligt niet aan dat firefox de stylesheet niet laadt, want anders was het achtergrond plaatje niet te zien.
- <div id="main"> werkt ook gewoon. Daar staat dat de lay moet gecentreert worden:

#main {
text-align: center;
width: 100%;
font-family: Verdana, Tahoma, Arial;
font-size: 12px;
color: #000000;
}
En waarom werkt dit? Ik heb alles in style="" gezet ipv in id="main".

- Veeeeeel gekloot met allerlei dingen wat ik niet meer pcies weet wat

[crisp]

text-align is voor inline content; dat IE daar ook blocklevel content mee centreerd is een fout van IE

[Verwijderd]

Tha Ertenal schreef op donderdag 08 juni 2006 @ 16:39:
- <div id="main"> werkt ook gewoon. Daar staat dat de lay moet gecentreert worden:

#main {
text-align: center;
width: 100%;
font-family: Verdana, Tahoma, Arial;
font-size: 12px;
color: #000000;
}

Probeer eens een 'margin: 0 auto' op #main?

edit: bullshit van mezelf, aangezien je div 100% breed is en dit dus niets uithaalt

[ Voor 31% gewijzigd door Verwijderd op 08-06-2006 16:52 ]

[DoubleJ]

probeer eens zoiets als

Cascading Stylesheet:

#main {
margin-left:auto;
margin-right:auto;
width: 780px;
font-family: Verdana, Tahoma, Arial;
font-size: 12px;
color: #000000;
}

Enneh... over dat logo mag best wat antialiasing

@chime
Da's in principe hetzelfde als mijn oplossing, maar dan minder correct.

[ Voor 50% gewijzigd door DoubleJ op 08-06-2006 17:00 ]

[Verwijderd]

Je kan ook proberen om de inhoud van je webpagina in een tabel te plaatsen.

Creëer een tabel met 3 kolommen (1 rij)
Kies een breedte (pixels of %) voor elk van de cellen.
Plaats in de linker cel en de rechter cel een & nbsp ;
Plaats in de centrale cel de huidige inhoud.

Op deze manier zou het in beide browsers wel moeten lukken.

Let wel op: probeer je pagina te testen op verschillende resoluties, kwestie om zeker te zijn dat de lay-out in orde is. (Kan wel eens handig zijn wanneer je de breedte van de cellen bepaald met pixels

[crisp]

chime: anno 2006 nog tabellen aanraden voor layout-doeleinden is nou niet bepaald goed advies

[Tha Ertenal]

wauw, het werkt inderdaad. Nu nog ff wat naar beneden halen (want het zit nu tegen het logo aan), maar dat komt wel goed! Tnx!