Gå til innhold

Height og line-height i a-tag

yinyou

Av yinyou
i Programmering og webutvikling

Anbefalte innlegg

yinyou

yinyou

Skrevet
Skrevet (endret)

Jeg lurer på om det går an og få til slik som det er på bildet jeg har lagt med.

Jeg brukte bare height:40px; og line-height:40px; så fikk jeg den sånn, men det funker kun i IE når det ikke er doctype.

Men det jeg lurer på er hvordan man får til sånn slik at det funker i alle nettlesere i xhtml hvis det går an?

 

Edit:

Nytt spørsmål, min nederste kommentar...

Endret av yinyou
Lenke til kommentar

Videoannonse

Videoannonse
Annonse
yinyou

yinyou

Skrevet
  • Forfatter
Skrevet
Er du nødt til å bruke xhtml?

Har du kode-eksempler?

Er vel ikke nødt, men dette funker ikke med noen doctyper fant jeg ut og vil jo ha en doctype :)

 

Fra spesifikasjonen:

 

height

Applies to: all elements but non-replaced inline elements, table columns, and column groups

Dvs, du kan ikke sette høyde på a-elementet sånn helt uten videre. For å hjelpe deg videre, trenger vi mer informasjon om hva du vil oppnå.

 

Takk, skjønner.

 

Her er kodeeksempel:

 

Denne siden virker...

<html>
<head>
<style type="text/css">
<!--
a#test
{
border-left:2px #aaaaaa dashed;
border-right:2px #aaaaaa dashed;
color:#aaaaaa;
height:68px;
line-height:68px;
text-decoration:none;
}
-->
</style>
</head>
<body>
<a href="#" id="test">Link</a>
</body>
</html>

Altså det jeg vil er å ha høye kanter på høyre og venstre sidene.

Men hvis jeg setter på en eller annen doctype så blir det korte kanter.

 

Har prøvd med <span> men det virket heller ikke? :S

Lenke til kommentar
Runar0

Runar0

Skrevet
Skrevet (endret)
Fra spesifikasjonen:

 

height

Applies to:  all elements but non-replaced inline elements, table columns, and column groups

 

Dvs, du kan ikke sette høyde på a-elementet sånn helt uten videre. For å hjelpe deg videre, trenger vi mer informasjon om hva du vil oppnå.

9526711[/snapback]

 

Som haugsand skriver så gjelder ikkje height på inline-elementer noe <a> tagger er, vist du vil ha høgdre på ein link så må du legge til display:block; i a#test.

Endret av Runar0
Lenke til kommentar
yinyou

yinyou

Skrevet
  • Forfatter
Skrevet (endret)

Tusen takk!

Live e herlig :D

 

Men det var bare en ting at jeg har linkene i en div og hvis jeg bruker display:block blir det mange linjer nedover bare.

Fins det en enkel måte og få dem der de skal være uten å måtte styre med position:absolute for hver link osv?

Takker for svar.

Endret av yinyou
Lenke til kommentar
834HF42F242

834HF42F242

Skrevet
Skrevet (endret)

Han oppnår begge deler med denne koden:

Edit: Har ikke tid å sjekke, men vil ikke teksten stille seg vertikalt da?

<html>
<head>
<style type="text/css">
<!--
a#test
{
border-left:2px #aaaaaa dashed;
border-right:2px #aaaaaa dashed;
color:#aaaaaa;
height:68px;
text-decoration:none;
}
ul
{
list-style-type: none;
}
li
{
line-height:68px;
}
-->
</style>
</head>
<body>
<ul>
<li><a href="#" id="test">Link</a></li>
</ul>
</body>
</html>

Endret av neitakk
Lenke til kommentar
Haraldson

Haraldson

Skrevet
Skrevet

Så du mener det er bedre å forholde seg til line-height på ett element og height på et annet, som til enhver tid bør matche?

 

Her er det vel uansett snakk om 'spesielle' lenker, jeg tenker meny, les mer, sånne type lenker som uansett ikke trenger å stå sammen med annen tekst i generelle li-er eller p-er. Ser ikke helt poenget.

Lenke til kommentar

Opprett en konto eller logg inn for å kommentere

Du må være et medlem for å kunne skrive en kommentar

Opprett konto

Det er enkelt å melde seg inn for å starte en ny konto!

Start en konto

Logg inn

Har du allerede en konto? Logg inn her.

Logg inn nå
Gå til emneliste
×
×
  • Opprett ny...