Søg
Avatar billede samsayit Nybegynder
10. august 2005 - 20:23 Der er 9 kommentarer og
1 løsning

To forskellige link-designs + Luft mellem links i det ene

Jeg har brug for to linkdesigns, et til navigationen og et til indholdet.

Jeg er ikke sikker på, om det er korrekt, men til indholdet anvender jeg blot a:link, a:hover osv., og til navigationen har jeg så lavet et sæt med .nav:link, .nav:hover osv.

Jeg laver links i navigationen således:
<a class="nav" href="link.html">Link</a>

Det virker, i hvertfald næsten :)
Men i navigationen vil jeg gerne have, at der er en smule luft (f.eks. 5px) mellem links'ne, men dette kan jeg ikke få til at fungere. Jeg har prøvet at indsæte
    margin-bottom: 5px;
under .nav:link, men det virker ikke.
Jeg er ikke interesseret i, at det er selve line-height, idet dette vil få et link, der strækker sig over to linier, til at se forkert ud.

Håber, at ovenstående er forståeligt, eller uddyber jeg gerne.
Avatar billede nielle Nybegynder
10. august 2005 - 20:40 #1
Har du defineret din link-style på denne her måde?

a.nav:link { ... }

?
Avatar billede hells Nybegynder
10. august 2005 - 21:21 #2
Hvis det passer med dit design, så prøv:
.nav {
display: block;
}

Du bør ikke bruge pseudo-class-selectoren .nav:link til angivelse af f.eks. margener, da dette vil ændre sig, hvis man har brugt linket før.
Avatar billede samsayit Nybegynder
10. august 2005 - 22:18 #3
a.nav:link { ... } ?

Nej, sådan herÆ
.nav:link { ... }

Men det er måske forkert??
Avatar billede nielle Nybegynder
10. august 2005 - 22:55 #4
Ja, pseudopkoder virker nemlig kun på a-tags. De kan derfor ikke sættes på andet.
Avatar billede hells Nybegynder
10. august 2005 - 23:07 #5
nielle, det er rigtigt, at :link- og :visited-pseudoklasserne kun virker på a-tags (med href-attributter), men det betyder ikke, at man behøver at specificere det i eens CSS-selectorer.

F.eks. virker det blot at skrive:
:link {color: #00f;}
:visited {color: #0f0;}
Man kan endda spare et par tastetryk på den måde, da man er sikker på, at de to selectorer kun virker på links.

Den eneste forskel mellem a.nav:link og .nav:link er, at den første er mere specifik, men det har ingen betydning, da :link-pseudoklassen, som før skrevet, alligevel kun virker på links.
Avatar billede roenving Novice
11. august 2005 - 01:43 #6
Tjah, en af hells ideer virker jo ganske udmærket, f.eks.

a,a:link,a:visited{display:block;margin-bottom:5px;}

-- dog skal man så huske at undlade at lave linje skift imellem de forskellige links !-)

-- men en af de mere brugte tricks til at løse problematikken er også at sætte det i lister:

<ul>
  <li><a href="#">link</a></li>
  <li><a href="#">link</a></li>
  <li><a href="#">link</a></li>
</ul>

-- og så style li-tags til ikke at have en list-style, samt dine øvrige properties !-)
Avatar billede olebole Juniormester
11. august 2005 - 20:12 #7
<ole>

:link {color: #00f;}
:visited {color: #0f0;}

- er en skidt kodestil at tillægge sig. Ikke mindst på tærsklen til XHTML, hvor ethvert element kan defineres som, hvad somhelst (næsten) ... udover det vel nærmest er negationen til semantisk kode  :)

/mvh
</bole>
Avatar billede nielle Nybegynder
16. august 2005 - 17:46 #8
Har du fået løst dit problem?
Avatar billede samsayit Nybegynder
10. februar 2007 - 23:03 #9
jeg kan ærligt talt ikke huske om jeg fik det løst, blev desværre ramt af akut arbejds-relateret rejse og siden glemte jeg alt om det. Sorry.

nielle, opret svar for point, hvis du da stadig er her :-)
Avatar billede nielle Nybegynder
11. februar 2007 - 07:53 #10
Svar :^)
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
Webudvikling kurser
Vi tilbyder markedets bedste kurser inden for webudvikling
Se alle Webudvikling kurser

Flere spørgsmål fra HTML kategorien

Titel Indlæg Oprettet Seneste aktivitet
Hjælp med HTML og CSS Af Nojsa i HTML 18 10/09/202515:07 17/09/202515:11
CSS 2 x firkanter + tekst på samme linje Af nemlig i HTML 3 19/03/202522:16 20/03/202513:04
Se og ændre html på en webside Af magger i HTML 4 11/03/202513:55 12/03/202506:56
Få input felt, der er med fed skrift og formatteres på linje Af KurtG i HTML 5 02/03/202520:05 04/03/202515:40
Variabler som ikke virker Af Frits Jensen i HTML 3 30/10/202409:37 01/01/202515:27
Se alle spørgsmål i kategorien Opret spørgsmål

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.

Opret Log ind

Du kan også logge ind via nedenstående tjenester

Alle kategorier på Eksperten
Seneste spørgsmål Seneste aktivitet
I dag 16:05 Samsung Galaxy vil ikke ud af "Sikker tilstand" Af ErikHg i Mobiltelefoner
I går 12:15 morf bilede Af knuldefar1942 i Fri debat
07/0822:13 Gemme største værdi Af Lemming@privat.dk i Excel
07/0821:39 Kvindelig journalist ved DR - hvad er hendes navn. Af ErikHg i Fri debat
06/0817:10 Windows 10 Home 22H2 produktnøgle Af Uvanga i Windows
White papers
Flere white papers »