Hallo,

Op mijn site wordt in ie7 het menu fout weergegeven, het menu wordt weergegeven zoals hieronder te zien is:
Dit is de fout.

Dit is de website.

Weet iemand hoe dit komt, want heb echt geen idee en wil eigenlijk wel dat in ieder geval het menu goed wordt weer gegeven. Als iemand een oplossing heeft voor de icoontjes in het zijnmenu die ook fout staan zou dit ook fijn zijn ben hier zelf ook nog naar aan het kijken, maar het rare is dat al deze fouten alleen in ie7 zijn dus kan ik ook niet snel met firebug of zoiets kijken.

Alvast bedankt.

-knip-

Nee, ook deze oplossing werkt helaas niet iemand een ander idee?
Aanvullend bericht:
Ik ben erachter, dit moest worden toegevoegd:

PHP Code:

#bovenmenu ul li{
display: inline;
} 


Nu alleen nog het probleem van de zijmenu afbeeldingen.

Kevin,

Het probleem met je icoontjes in het linker menu zijn ook redelijk eenvoudig op te lossen. Ik heb nog niet in je broncode gekeken dus als de volgende oplossing niet werkt moet je het maar even aangeven dan kijk ik wat dieper.

Je icoontjes zijn plaatjes welke je in een Hx zet. Het hx is heeft een display waarde van 'block' je kunt het volgende in je CSS zetten:

Code:

.menuimg  {
display: inline-block;
float:right;
margin-top:-5px;
padding-right:10px;
}

Als je voor de rest geen vreemde CSS hebt zou de afbeelding netjes in line moeten lopen met de tekst in je H2.

Het staat nu online met inline-block, maar hij geeft de plaatjes nog steeds eronder weer.

Probeer float, zo heb ik het gefixt.
Ik heb alle inline weggehaald

Met alleen float:right; deed hij het ook fout in ie7, of bedoeld u iets anders?

Dat heb ik inmiddels al een paar keer gezien, en normaal gesproken kan je dat gewoon oplossen door de "li" en de "a" een float: left; te geven.

#menubar
{
width: 900px;
height: 45px;
padding-left: 5 px;
background: url(../images/menu-bar.png) no-repeat;
overflow: hidden;
}

#menubar ul
{
list-style: none;
margin: 10px 0 0 260px;

}

#menubar li
{
float: left;
}

#menubar li a
{
height: 35px;
width: 85px;
display: block;
padding-top: 7px;
font-size: 12px;
font-family: verdana;
text-align: center;
text-decoration: none;
color: #ffffff;
}

#menubar li a:hover
{
height: 35px;
width: 85px;
display: block;
text-decoration: none;
padding-top: 10px;
background: url(../images/button.png);
background-repeat: no-repeat;
background-position: center top;

}

Dit is hoe ik mijn menubar heb ingedeeld, voor dit was het fout, dus ik probeer deze manier elke keer weer toe te passen.

Misschien heb je hier iets aan ;')