Jacques,
In
http://www.mozbrowser.nl/web/hvhetslot/ ... zaken.html heb ik de aanbevelingen die ik in dit onderwerp heb gemaakt toegepast:
1) een grote div om het geheel maken, zodat het gecentreerd kan worden:
Code: Selecteer alles
<div style="width: 876px; margin-left: auto; margin-right: auto; border: 1px solid #EEE; background-color: transparent; text-align: left; ">
inhoud van de pagina (menu + rest)
</div>
2) het menu een vaste breedte geven en ook centreren:
Code: Selecteer alles
#drop-down-menu
{
width: 600px;
height: 55px;
margin-left: auto;
margin-right: auto;
}
Ik heb hier wat dunne lijntjes omheen getrokken zodat je kunt zien waar de verschillende elementen precies staan (en hoe deze zijn uitgelijnd).
Ook moet je eens op de tabel met de logo's letten als je mijn versie vergelijkt met de originele versie:
origineel: http://www.hvhetslot.nl/lopenende%20zaken.html
aangepast: http://www.mozbrowser.nl/web/hvhetslot/ ... zaken.html
In mijn aangepaste versie heb ik het logo voor de tabel verkleind naar 100 bij 85 pixels. Daar blijft er van het logo nog maar 10 procent over van de bestandsgrootte, maar belangrijker: de afbeelding ziet er een stuk strakker uit. In jouw geval zie je wat spikkeltjes en in de verkleinde versie zie je ook wat meer lijntjes en kun je beter zien wat het moet voorstellen.
Overigens vind ik het menu nog wel wat lastig om te centreren. De hoeveelheid items in het menu bevat de breedte van het menu (en dus wat er gecentreerd moet worden). Verder blijf ik aan de linkerkant een ruimte van 40 pixels overhouden die ik niet echt weg krijg. Daarom is er nu aan de rechterkant ook eenzelfde ruimte, zodat het geheel weer gecentreerd wordt.
Mede daarom is het handig om dit menu 1 keer te definiëren en die dan in elke pagina op te nemen (include).
