---
title: "Göra text-länk till en större knapp"
type: "forum-thread"
url: "https://www.webforum.nu/amne/html-css/171942-göra-text-länk-till-en-större-knapp"
topic: "HTML & CSS"
topic_url: "https://www.webforum.nu/amne/html-css"
author: "EmmaW"
published: "2008-06-03T14:38:19.000Z"
updated: "2008-06-04T06:27:36.000Z"
replies: 9
views: 837
page: 1
pages: 1
language: "sv-SE"
site: "webForum — webforum.nu"
rights: "Upphovsrätten till varje inlägg tillhör dess författare."
attribution: "Citera som: webForum, https://www.webforum.nu/amne/html-css/171942-göra-text-länk-till-en-större-knapp"
---

# Göra text-länk till en större knapp

## #1 — EmmaW, 2008-06-03T14:38Z

Hej :)

Jag har text länkar i en meny. Men jag tycker det blir för litet ställe att klicka på om man måste träffa exakt rätt på texten. 

Jag har sett många sidor som har text länkar men det räcker med att man klicka nära texten så funkar det. 

Hur går det här att fixa på bästa sätt? Går det t ex att fixa så man kan klicka var som helst på själva "raden" eller liknande?

Permalänk: https://www.webforum.nu/p/171942

## #2 — JAreMANNEN, 2008-06-03T14:46Z

> **EmmaW skrev:**
>
> Hej :)
> 
> Jag har text länkar i en meny. Men jag tycker det blir för litet ställe att klicka på om man måste träffa exakt rätt på texten. 
> 
> Jag har sett många sidor som har text länkar men det räcker med att man klicka nära texten så funkar det. 
> 
> Hur går det här att fixa på bästa sätt? Går det t ex att fixa så man kan klicka var som helst på själva "raden" eller liknande?

Med CSS:

```
<style type="text/css">
#container a {
     padding:10px;
}
</style>

<div id="container">
     <a href="#">Testlänk</a>
</div>
```

Permalänk: https://www.webforum.nu/p/2116627

## #3 — Danne V, 2008-06-03T14:58Z

> **JAreMANNEN skrev:**
>
> Med CSS:
>
>
> ```
> <style type="text/css">
> #container a {
>      padding:10px;
> }
> </style>
> 
> <div id="container">
>      <a href="#">Testlänk</a>
> </div>
> ```

Njae.... man ska nog lägga till display:block för att det ska funka till 100%:

```
#container a {
padding:10px;
display:block;
}
```

...sen kan man laborera med olika paddings.

Permalänk: https://www.webforum.nu/p/2116631

## #4 — EmmaW, 2008-06-03T16:07Z

Jo utan "display:block;" blev det lite problem.

Men nu funkar allt fint, tack för hjälpen! :)

Permalänk: https://www.webforum.nu/p/2116643

## #5 — Okkido, 2008-06-03T16:16Z

> **Danne V skrev:**
>
> Njae.... man ska nog lägga till display:block för att det ska funka till 100%:

Med display:block så gör du om ditt inline-element (länken) till ett blockat element, vilket kommer göra att länken kommer uppta så mycket horisontellt utrymme som föräldern tillåter. Display:block behövs inte för att lägga till padding på något element. Är det margin du tänker på Danne V?

Permalänk: https://www.webforum.nu/p/2116644

## #6 — EmmaW, 2008-06-03T16:35Z

Oj, vänta nu, det här verkar inte alls funka när jag testar i firefox (funkar fint i internet explorer bara). Vad kan det bero på  :q

Permalänk: https://www.webforum.nu/p/2116645

## #7 — Danne V, 2008-06-03T16:40Z

> **EmmaW skrev:**
>
> Oj, vänta nu, det här verkar inte alls funka när jag testar i firefox (funkar fint i internet explorer bara). Vad kan det bero på  :q

Du måste nog visa ALL kod (och CSS) eftersom det är troligt att det är något vi inte känner till som orsakar problemen.

(Gärna ladda upp ALLT och ge oss en länk....)

Permalänk: https://www.webforum.nu/p/2116646

## #8 — Danne V, 2008-06-03T16:43Z

> **Okkido skrev:**
>
> Med display:block så gör du om ditt inline-element (länken) till ett blockat element, vilket kommer göra att länken kommer uppta så mycket horisontellt utrymme som föräldern tillåter. Display:block behövs inte för att lägga till padding på något element. Är det margin du tänker på Danne V?

Nej, inte direkt. Men jag antog, kanske felaktigt, att man oftast vill ha en knappliknande länk i t.ex. menyer eller andra ställen där man har en förälder. Och då kan man ju lägga till paddings (och marginaler) som man vill. Huvudsaken är ju att display:block finns där.
Men jag kanske tog saker och ting för givet. Om Emma visar all kod så blir det nog lättare.....

Permalänk: https://www.webforum.nu/p/2116647

## #9 — EmmaW, 2008-06-03T20:28Z

Först fick jag tre helt olika resultat i IE, Firefox och Opera. Jag fick ta bort "display:block;" och trixa massor, vet inte riktigt allt jag gjorde.. Men tillslut så verkar det som jag fått allt att funka i alla fall :) 

Dock så tycker jag alltid det är hemskt jobbigt med alla dessa skillnader i olika webläsare, det borde förbjudas :(

Permalänk: https://www.webforum.nu/p/2116679

## #10 — icaaq, 2008-06-04T06:27Z

Stora skillnader kan bero på [quirksmode](http://www.webforum.nu/search.php?searchid=967572), vad använder du för [DOCTYPE](http://www.webforum.nu/search.php?searchid=967573)?

mv icaaq

Permalänk: https://www.webforum.nu/p/2116714

---

Tråden på webben: https://www.webforum.nu/amne/html-css/171942-göra-text-länk-till-en-större-knapp