Avatar billede thomaskramer Juniormester
31. januar 2007 - 01:06 Der er 3 kommentarer og
1 løsning

Problemer med border på a:link og a:hover

jeg har et problem med at få min border til at virke hele vejen omkring et link. Når jeg tester i browser, så er der kun border på  siderne og i bunden - men ikke i toppen.

Er det nogen der ved hvad jeg gør galt??


jeg har en tabel som ser således ud:

--------------

<table width="180" border="0" cellspacing="0" cellpadding="0" bgcolor="white" height="100">
                            <tr>
                                <td valign="bottom"></td>
                                <td valign="bottom">
                                <a href="#">asdfasdf</a>
                                </td>
                                <td valign="bottom"></td>
                            </tr>
                        </table>
                                <td></td>
                            </tr>
                        </table>

-------------

og en css der ser således ud:

-------------

body { color: black; background-color: white; }

p {}

td {}

a:link { color: black ; font-size: 11px; font-family: verdana; background-color: white; padding: 20px 30px 5px; border: solid 1px gray; }

a:visited { color: black ; font-size: 11px; font-family: verdana; background-color: white; padding: 20px 30px 5px; border: solid 1px gray; }

a:hover { color: black ; font-size: 11px; font-family: verdana; background-color: #eef5d7; padding: 20px 30px 5px; border: solid 1px gray; }

a:active { color: black ; font-size: 11px; font-family: verdana; background-color: white; padding: 20px 30px 5px; border: solid 1px gray; }

--------------
Avatar billede notes2c Nybegynder
31. januar 2007 - 08:15 #1
Du kan gøre det ved at lave dit link til et block element:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">

<html>
<head>
<title>Untitled</title>
<meta http-equiv="Content-type" content="text/html; charset=iso-8859-1">
<style type="text/css">
<!--
body {
    margin: 0;
    padding: 0;
}
body { color: black; background-color: white; }

p {}

td {}
a { display: block; color: black ; font-size: 11px; font-family: verdana; background-color: white; padding: 20px 30px 5px 5px; border: solid 1px gray; }
a:hover { background-color: #eef5d7; }
-->
</style>
<script type="text/javascript">
</script>
</head>

<body>
<table width="180" border="0" cellspacing="0" cellpadding="0" bgcolor="white" height="100">
<tr>
    <td valign="bottom"></td>
    <td valign="bottom"><a href="#">asdfasdf</a></td>
    <td valign="bottom"></td>
</tr>
</table>


</body>
</html>
Avatar billede thomaskramer Juniormester
31. januar 2007 - 09:50 #2
Du er genial :-)

Tak for hjælpen
Avatar billede olebole Juniormester
31. januar 2007 - 14:58 #3
<ole>

- men husk, at link'et så ikke længere kan ligge i f.eks. et p- eller et span-element  ;o)

/mvh
</bole>
Avatar billede notes2c Nybegynder
31. januar 2007 - 15:50 #4
Man skal selvfølgelig ændre tingene så det benytter en klasse eller id.
Avatar billede Ny bruger Nybegynder

Din løsning...

Tilladte BB-code-tags: [b]fed[/b] [i]kursiv[/i] [u]understreget[/u] Web- og emailadresser omdannes automatisk til links. Der sættes "nofollow" på alle links.

Loading billede Opret Preview
Kategori
Vi tilbyder markedets bedste kurser inden for webudvikling

Log ind eller opret profil

Hov!

For at kunne deltage på Computerworld Eksperten skal du være logget ind.

Det er heldigvis nemt at oprette en bruger: Det tager to minutter og du kan vælge at bruge enten e-mail, Facebook eller Google som login.

Du kan også logge ind via nedenstående tjenester