[html/css] IE7 3px omhoog

[andriesf]

hey allemaal,

ik heb een probleem met een site in IE7 namelijk dat het menu 3 px te laag word weergegeven, dus de text moet 3 px omhoog,

#menu {
	margin-top: 39px;
	margin-left: 210px;
	color: #FFFFFF;
	padding-top: 3px;
}

dit is de code die ik gebruik voor het menu, maar wanneeer ik padding-top weghaal doet hij het in andere browsers 3 px te hoog, weer iemand hoe ik die kan oplossen dat alleen in IE7 3 px omhoog gaat?

MVG,
Andries

 

[ICenW]

BOX Probleem

Klopt, IE gaat anders met het box model om (css). Google maar eens box problem IE op google. Als je alleen margin in <p> en <H1> gebruikt gaat het goed. Al het anderre op 0 zetten.

 

[ErikBooy007]

Wat ik altijd doe is bovenaan mijn CSS dit zetten:

* {
  padding: 0px;
  margin: 0px;
}

Gewoon van alles de padding en margin op 0. Niet door de browser zelf laten bepalen. Dan stel ik per element wel in wat het specifiek daar moet zijn. Scheelt je een hoop van dit geklooi.

 

[Goeroeboeroe]

IE gaat alleen anders met het box model om als je geen volledig en geldig doctype gebruikt. IE schiet dan in de zogenaamde 'quirks mode'.
Dit is te weinig code om er iets van te kunnen zeggen.
Als het geen andere oorzaak heeft, kun je voor IE 7 dit toevoegen in de head:

<!--[If IE 7]>
<style type="text/css">
#menu: padding-top: 0;
</style>
<![endif]-->

De spaties tussen <! en -> moeten precies zo staan.
Je kunt in plaats van de css ook 'n link naar 'n extern css-bestand alleen voor IE 7 zetten.
Maar het is goed mogelijk dat er gewoon iets mis is in de code, en dat je nog andere problemen gaat krijgen.

 

[ErikBooy007]

Moet

<!--[If IE 7]>
<style type="text/css">
#menu: padding-top: 0;
</style>
<![endif]-->

niet

<!--[If IE 7]>
<style type="text/css">
#menu{ padding-top: 0; }
</style>
<![endif]-->

zijn?

 

[Goeroeboeroe]

Ja, daar heb je helemaal gelijk in. Twee keer overgelezen... Da's vast de oude dag

 

[andriesf]

hey

bedankt allemaal, ik zal het eens uitproberen, en kijken of alles werkt, maar ik heb standaard alles al op 0 staan met:

* {
  padding: 0px;
  margin: 0px;
}

dus daar zal het niet aan liggen, ik zal die van <!--[if ie7]> eens uitproberen.