---
title: "Bottenmarginal på LI"
type: "forum-thread"
url: "https://www.webforum.nu/amne/html-css/136884-bottenmarginal-på-li"
topic: "HTML & CSS"
topic_url: "https://www.webforum.nu/amne/html-css"
author: "JAreMANNEN"
published: "2005-11-03T10:11:28.000Z"
updated: "2005-11-03T14:36:31.000Z"
replies: 13
views: 444
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/136884-bottenmarginal-på-li"
---
# Bottenmarginal på LI
## #1 — JAreMANNEN, 2005-11-03T10:11Z
Tjoo!
Har lite problem med en lista som jag byggt upp horisontellt.
Som ni ser på den bifogade bilden så får jag en marginal i botten på listan.
Har försökt trixa å fixa men lyckas inte så nu behöver jag lite hjälp.
```
* {margin:0; padding:0;}
#TopMenu {background-color:#fff; width:auto;}
#TopMenu ul {border-bottom:solid 1px #000; border-top:solid 1px #000;}
#TopMenu ul li {display:inline; border-left:solid 1px #000; padding:0 22px 0 22px;}
#TopMenu ul li a {font:10pt Arial; font-weight:bold; text-decoration:none;}
```
Själva listan
```
```
Bilagor:
- [tmp.gif](https://www.webforum.nu/a/8346.gif)
Permalänk: https://www.webforum.nu/p/136884
## #2 — J.N., 2005-11-03T12:53Z
HEJ!
Testade i IE6 och FF, men jag får ingen linje som du får?
Permalänk: https://www.webforum.nu/p/1698556
## #3 — JAreMANNEN, 2005-11-03T12:59Z
> **J.N. skrev:**
>
> HEJ!
>
> Testade i IE6 och FF, men jag får ingen linje som du får?
Glömde skriva tidigare att i IE funkar det klockrent.
Det är i FF (1.0.6) som mellanrummet uppstår.
Nu har jag ju iofs en massa andra element och divar runtomkring, la upp en helt ny testsida med enbart ovanstående kod.
Men jag får fortfarande 1px mellanrum :l
Permalänk: https://www.webforum.nu/p/1698560
## #4 — J.N., 2005-11-03T13:25Z
HEJ!
Använder också Firefox 1.0.6, men utan problem.
Låter som du får låta oss testa samma sida som du gör?
Bilagor:
- [firefox.gif](https://www.webforum.nu/a/8349.gif)
Permalänk: https://www.webforum.nu/p/1698568
## #5 — JAreMANNEN, 2005-11-03T13:29Z
Okej!
Permalänk: https://www.webforum.nu/p/1698569
## #6 — Peter S, 2005-11-03T13:38Z
Jag får en marginal som är lika stor i båda bläddrarna.
Permalänk: https://www.webforum.nu/p/1698573
## #7 — J.N., 2005-11-03T13:39Z
HEJ!
Oavsett om jag kör din kod, med extrakod i, eller rensar bort övernavigeringen, fungerar det perfekt!
Permalänk: https://www.webforum.nu/p/1698574
## #8 — JAreMANNEN, 2005-11-03T13:42Z
Men altså, vad är det frågan om :OO
Jag trodde att det kunde bero på att jag kommit åt och ändrat text-storleken (ctrl+mus-scroll), men icke... Jag måste förminska texten jättemkt för att marginalen ska försvinna.
Väldigt skumt att det visas olika...
Permalänk: https://www.webforum.nu/p/1698577
## #9 — JAreMANNEN, 2005-11-03T14:05Z
Bara så det inte blir något missförstånd så bifogar jag en bild med marginalen rödmarkerad.
Förstår som sagt inte hur det kan visa olika i samma läsare...
Bilagor:
- [tmp.gif](https://www.webforum.nu/a/8350.gif)
Permalänk: https://www.webforum.nu/p/1698587
## #10 — tompe, 2005-11-03T14:12Z
Får också en marginal i botten på listan. Använder Fx 1.0.7.
EDIT) [Testade lite](http://tompe.nu/lista.html)
Permalänk: https://www.webforum.nu/p/1698589
## #11 — silfver, 2005-11-03T14:15Z
Jag får en marginal i Firefox 1.0.7 när jag kollar på .
Bilagor:
- [marginal.GIF](https://www.webforum.nu/a/8351.gif)
Permalänk: https://www.webforum.nu/p/1698591
## #12 — Insider, 2005-11-03T14:31Z
Testa med den här CSS-koden:
```
* {margin:0; padding:0;}
#TopMenu {background-color:#fff; width:auto;}
#TopMenu ul {border-bottom:solid 1px #000; border-top:solid 1px #000;}
/*Easy clearing of floats [url]http://www.positioniseverything.net/easyclearing.html[/url]*/
#TopMenu ul:after {
content: ".";
display: block;
height: 0;
clear: both;
visibility: hidden;
}
#TopMenu ul {display: inline-table;}
/* Hides from IE-mac \*/
* html .#TopMenu ul {height: 1%;}
#TopMenu ul {display: block;}
/* End hide from IE-mac */
/*Easy clearing of floats End*/
#TopMenu ul li {display:inline;}
#TopMenu ul li a {font:10pt Arial;line-height:20px;font-weight:bold;
text-decoration:none;float:left;border-left:solid 1px #000; padding:0 22px 0 22px;}
```
Som du ser har jag kört med ett specialhack för att slippa lägga in extra classattribut i html-koden. Det finns för- och nackdelar med att använda css-hack.
Du styr höjden på menyn med line-height på #TopMenu ul li a
Permalänk: https://www.webforum.nu/p/1698602
## #13 — JAreMANNEN, 2005-11-03T14:34Z
> **tompe skrev:**
>
> Får också en marginal i botten på listan. Använder Fx 1.0.7.
>
> EDIT) [Testade lite](http://tompe.nu/lista.html)
Jo, det fungerade...men nu ballade det ur i IE istället :OO
Permalänk: https://www.webforum.nu/p/1698603
## #14 — JAreMANNEN, 2005-11-03T14:36Z
> **Insider skrev:**
>
> Testa med den här CSS-koden:
>
>
> ```
> * {margin:0; padding:0;}
> #TopMenu {background-color:#fff; width:auto;}
> #TopMenu ul {border-bottom:solid 1px #000; border-top:solid 1px #000;}
>
> /*Easy clearing of floats [url]http://www.positioniseverything.net/easyclearing.html[/url]*/
> #TopMenu ul:after {
> content: ".";
> display: block;
> height: 0;
> clear: both;
> visibility: hidden;
> }
>
> #TopMenu ul {display: inline-table;}
>
> /* Hides from IE-mac \*/
> * html .#TopMenu ul {height: 1%;}
> #TopMenu ul {display: block;}
> /* End hide from IE-mac */
> /*Easy clearing of floats End*/
>
> #TopMenu ul li {display:inline;}
> #TopMenu ul li a {font:10pt Arial;line-height:20px;font-weight:bold;
> text-decoration:none;float:left;border-left:solid 1px #000; padding:0 22px 0 22px;}
> ```
>
>
> Som du ser har jag kört med ett specialhack för att slippa lägga in extra classattribut i html-koden. Det finns för- och nackdelar med att använda css-hack.
>
> Du styr höjden på menyn med line-height på #TopMenu ul li a
Lysande!
Tackar :)
Permalänk: https://www.webforum.nu/p/1698604
---
Tråden på webben: https://www.webforum.nu/amne/html-css/136884-bottenmarginal-på-li