Probleem bij renderen pagina in verschillende browsers

Hallo,

Ik ben bezig met het ontwerpen van een site, zie voor opzet van de homepage

www.photosjob.nl/test

Nu heb ik echter een probleempje, in Safari, Firefox, Camino, iSurf en Netscape (allen in MacOS X) loopt de oranje balk helemaal goed door. In Internet Explorer (ook in MacOS X) verspringt deze echter. Ik heb hier geen pc bij de hand om te kijken hoe het er daar uitziet, maar weet iemand een oplossing voor dit probleem. Internet Explorer plaatst het gedeelte met de knoppen lager dan de andere browsers doen. Het HTML bestand van het bovenste frame is te vinden via deze link.

Alvast bedankt voor jullie hulp.

Groet,
Job

Het ziet er niet goed uit vanachter mijn PC. Je moet je bovenste frame een statische hoogte geven. Dit scheelt welicht. Werk je met Dreamweaver?

Nee, ik werk met GoLive, maar had het bovenste frame al op een vaste hoogte gezet, ik ga er even naar kijken. Dank voor je reactie.

Groet,
Job

oh oh, als explorer toch eens verboden zou kunnen worden! :P

anyway, misschien heb je hier iets aan:

http://validator.w3.org/check?uri=http%3A%2F%2Fwww.photosjob.nl%2Ftest%2Fhtml%2Fnavigation.html

sowieso altijd handig om je site mee te checken :slight_smile:

Zonder frames en met css:

[code:1:24ca7c314c]<html>
<head>
<title>Fotografie</title>
</head>
<style type="text/css">
body,html{ width:100%; margin:0; padding:0;}
#banner{ width:476px; height:18px; margin:10px 0 0 50px; background-image:url(banner.jpg);}
#menu{width:100%; height:20px; background-color:orange; margin:10px 0 0 0;}
#navlist ul{margin-left: 0;padding-left: 0;white-space: nowrap;}
#navlist li{display: inline;list-style-type: none;}
#navlist a { padding: 3px 10px; }
#navlist a:link, #navlist a:visited
{
color: #fff;
text-decoration: none;
}

#navlist a:hover
{
color: #000;
text-decoration: none;
}
</style>
<body>
<div id="banner"></div>
<div id="menu">
<ul id="navlist">
<li><a href="#">Portrait</a></li>
<li><a href="#">Features</a></li>
<li><a href="#">Daily Life</a></li>
<li><a href="#">Fashion</a></li>
</ul>
</div>
</body>
</html>
[/code:1:24ca7c314c]

Je zal het zelf wel ‘fine-tunen’.

Hoi Konijn,

Bedankt voor je css-codering, werkt goed, maar in Internet Explorer (op MacOS X) heb ik nu dat de teksten onder de oranje balk verschijnen, terwijl de andere browsers dit wel goed laten zien. Vreemd, maar ga er nog naar kijken. Ben nog niet thuis in CSS, maar zie er wel de mogelijkheden van in, ga me er maar eens in verdiepen. Bedankt alvast voor zover,

Groet,
Job