---

Hvordan kan jeg i css lave det sådan at baggrundsfarven skifter på den celle
i nedenstående tabel når musen er over?



#punkt {
padding-left: 4px;
padding-right: 4px;
border-right: #506d98 1px solid;
border-top: #000000 1px solid;
border-left: #000000 1px solid;
border-bottom: #506d98 1px solid;
background-color: #003366;
font-size: 10px;
height: 17px;
color: #ffcc00
}


<table border="0" cellspacing="0" cellpadding="0">
<tr><td id="punkt"><a href='#'>Privat</a></td></tr>
<tr><td id="punkt"><a href='#'>Uddannelse</a></td></tr>
<tr><td id="punkt"><a href='#'>Andet</a></td></tr>
</table>


/Magnus

---

Magnus wrote:
> Hvordan kan jeg i css lave det sådan at baggrundsfarven skifter på den celle
> i nedenstående tabel når musen er over?
>
>
>
> #punkt {
> padding-left: 4px;
> padding-right: 4px;
> border-right: #506d98 1px solid;
> border-top: #000000 1px solid;
> border-left: #000000 1px solid;
> border-bottom: #506d98 1px solid;
> background-color: #003366;
> font-size: 10px;
> height: 17px;
> color: #ffcc00
> }
>
>
> <table border="0" cellspacing="0" cellpadding="0">
> <tr><td id="punkt"><a href='#'>Privat</a></td></tr>
> <tr><td id="punkt"><a href='#'>Uddannelse</a></td></tr>
> <tr><td id="punkt"><a href='#'>Andet</a></td></tr>
> </table>
>
>
> /Magnus
>

Du kan ikke have flere id'er på samme side, brug
class i stedet for:
a.punkt { ... }

og

<td><a href="#" class="punkt">...</a></td>

Derved formaterer du a-markøren i steet for
tabelcellen, og det er jo det, du i virkeligheden
vil.

Tilføj til
..punkt {
....
background:transparent;}

og lav en ny formregel:

td a:hover {
background-color:[Den farve du vil ha' ved mouseover]
}

Det sku' klare det.
--

Med venlig hilsen

Jørgen Farum Jensen
http://www.webdesign101.dk

---

Jørgen Farum Jensen wrote:


> <td><a href="#" class="punkt">...</a></td>
>
> Derved formaterer du a-markøren i steet for
> tabelcellen, og det er jo det, du i virkeligheden
> vil.

Og så skal man huske at sætte a.punkt til blokvisning:

#punkt {
padding-left: 4px;
padding-right: 4px;
border-right: #506d98 1px solid;
border-top: #000000 1px solid;
border-left: #000000 1px solid;
border-bottom: #506d98 1px solid;
background-color: #003366;
font-size: 10px;
height: 17px;
color: #ffcc00;
display:block; /* tilføjet definition */
}

Ellers vil det ikke være hele tabelcellen, der skifter farve.

--
Med venlig hilsen
Erik Ginnerskov
http://hjemmesideskolen.dk - http://ginnerskov.dk
http://html-faq.dk/

---

Erik Ginnerskov wrote:

> Og så skal man huske at sætte a.punkt til blokvisning:
>
> #punkt {
> padding-left: 4px;
> padding-right: 4px;
> border-right: #506d98 1px solid;
> border-top: #000000 1px solid;
> border-left: #000000 1px solid;
> border-bottom: #506d98 1px solid;
> background-color: #003366;
> font-size: 10px;
> height: 17px;
> color: #ffcc00;
> display:block; /* tilføjet definition */
> }
>
> Ellers vil det ikke være hele tabelcellen, der skifter farve.
>

Du har fuldstædnig ret, det glemte jeg
lige i skyndingen.

Og du glemte vist at det er en /class/, der
skal formateres:

..punkt {
....
}
--

Med venlig hilsen

Jørgen Farum Jensen
http://www.webdesign101.dk

---

Jørgen Farum Jensen wrote:

> Og du glemte vist at det er en /class/, der
> skal formateres:
>
> .punkt {

ja, jeg så det først, da det var sendt. ;)

--
Med venlig hilsen
Erik Ginnerskov
http://hjemmesideskolen.dk - http://ginnerskov.dk
http://html-faq.dk/