Problem med meny med eksternt hover bilde.

[Torjus]

Kanskje en dårlig emnetittel, men vet ikke helt hvordan jeg skal forklare det. Jeg har en vanlig meny:

 

Hjem - Profil osv.

 

Ved hover på menyen så skal et bilde i header endre seg.

 

HTML:

 

 

					<div id="meny">

<ul>	
<li><a href="index.php" title="Blogg" id="blogg"><span></span></a></li>
<li><a href="profil.html" title="Profil" id="profil"><span>profil</span></a></li>
<li><a href="portefolje.php" title="Portefolje" id="portefolje"><span>portefolje</span></a></li>
<li><a href="galleri.php" title="Bildegalleri" id="galleri"><span>galleri</span></a></li>
<li><a href="kontakt.php" title="Kontakt" id="kontakt"><span>kontakt</span></a></li>
</ul></div> <!-- slutt meny -->

 

 

CSS:

 

#meny #blogg span{
 display: none;
 position: absolute;
 top: 0px;
 left: 340px;
 width: 550px;
 height: 281px;
 background: url(img/bloggheader.gif);
}

#meny #blogg:hover span{
 display: block;
 color: #fff;
}

 

 

Problemet er at siden er midtstilt, og bilde som kommer opp ved hover har verdien absolute.

Nå dukker jo bildet ved hover opp i div'en "#blogg". Jeg kunne brukt left: x; og top: x; hvis ikke siden var midtstilt, men det er den. Hva gjør jeg?

[Haraldson]

Det høres ærlig talt ut som en dum problemstilling. At siden er midtstilt ser jeg ikke på som veldig relevant – kan jeg få se siden live?

[Torjus]

Link

 

Bildet skal dukke opp i hjørnet til venstre (inni #header), ikke inni #blogg div'en.

[Haraldson]

#header {

postition: relative;

}

 

#meny #blogg span {

top: 0;

left: 0;

clear: both;

}

 

Dette er da stiler du legger til eksisterende CSS.