Rollover med css

[oleisbest]

Jeg har på siden under fått rollover effekten til å fungere. Problemet er at det blir et mellomrom over headeren. Markerer en hele siden ser en at det over headeren dukker opp to ikoner på størrelse med de jeg bruker i rollover effekten. Hvordan kan dette mellomrommet fås vekk eventulet fjerne de to skjulte bildene som legger seg over headeren.

 

Dette er html koden jeg bruker i index filen for å kalle på css koden min. Denne befinner seg i bodyen og under <div id="ramme">. Plasserer jeg denne koden et annet sted er det eneste jeg oppnår at jeg forskyver problemet.

 

<A href="startsiden.html" title="Hjem" id=meny1></A>
<A href="kontaktoss.html" title="Kontakt oss" id=meny2></A>

 

 

Dette er css koden som blir benyttet:

 

#meny1{
display:block;
position:relative;
top:131px;
left:675;
width:24px;
height:23px;
background-image:url(bilder/hjem.jpg);
}
#meny1:hover{
background-image:url(bilder/hjem2.jpg);
}
#meny2{
display:block;
position:relative;
top:108px;
left:707;
width:24px;
height:23px;
background-image:url(bilder/kontakt.jpg);
}
#meny2:hover{
background-image:url(bilder/kontakt2.jpg);
}

 

Her er siden:

Side

 

Noen som vet hva som må forandres?

 

mvh

ole

[FuLu]

I Opera så kommer ikke de to ikonene dine frem. Grunnen til at det blir mellomrom over header, har noe med at du har A elementene her. Selv om du sier position: relative her så mistenker jeg at de fortsatt vil påvirke dokumentet på den måten at det blir mellomrom her. Virker som Opera på en måte tolker det riktig, du flytter ikonene under header, siden header vises frem etter de to linkene/ikonene. Beste hadde vært å hatt header som egen DIV. Så kunne du puttet disse to linkene inni den igjen. Så kunne du sagt position: relative og brukt bottom og right på disse to ikonene til å plassere dem relativt for header div'en.