---
title: "Ul-Meny med både float left och right?"
type: "forum-thread"
url: "https://www.webforum.nu/amne/html-css/188106-ul-meny-med-både-float-left-och-right"
topic: "HTML & CSS"
topic_url: "https://www.webforum.nu/amne/html-css"
author: "Travoni"
published: "2011-10-17T18:28:26.000Z"
updated: "2011-10-17T21:29:44.000Z"
replies: 8
views: 624
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/188106-ul-meny-med-både-float-left-och-right"
---

# Ul-Meny med både float left och right?

## #1 — Travoni, 2011-10-17T18:28Z

Skulle vilja skapa en ul-li-meny som flödar både vänster och höger i samma list, hur gör jag det?

Det skall se ut så hära:

```
Hem * Om mig * Tjänster <-                                       -> Kontakt * Karta
```

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

## #2 — casca, 2011-10-17T18:35Z

Eller så left-floatar du hela menyn men paddar tredje li-elementet?

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

## #3 — Travoni, 2011-10-17T19:24Z

Hm, det skulle funka om menyn var statisk. Men längden på ul:en är dynamisk.

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

## #4 — Danne V, 2011-10-17T19:24Z

> **[Travoni skrev:](https://www.webforum.nu/p/1541362)**
>
> Skulle vilja skapa en ul-li-meny som flödar både vänster och höger i samma list, hur gör jag det?
> 
> Det skall se ut så hära:
> 
>
>
> ```
> Hem * Om mig * Tjänster <-                                       -> Kontakt * Karta
> ```

Jobba vidare på nedanstående.

```
<!DOCTYPE html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<style type="text/css">
<!--
#navbar {
width:400px;
margin:0 auto;
}
li {
float: left;
list-style: none;
}
.right {
float: right!important;
}
-->
</style>
</head>
<body>
<div id="navbar">
<ul>
<li>Hem </li>
<li>Om mig </li>
<li>Tjänster</li>
<li class="right">Kontakt</li>
<li class="right">Karta </li>
</ul>
</div>
</body>
</html>
```

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

## #5 — Travoni, 2011-10-17T20:24Z

Oki, nice. Lite fråga: varför använder man !important?

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

## #6 — voigtann1, 2011-10-17T20:26Z

> **[Travoni skrev:](https://www.webforum.nu/p/1541373)**
>
> Oki, nice. Lite fråga: varför använder man !important?

Ta bort den, finns ingen anledning att köra med det.

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

## #7 — Travoni, 2011-10-17T21:25Z

> **[Danne V skrev:](https://www.webforum.nu/p/1541365)**
>
> Jobba vidare på nedanstående.
>
>
> ```
> <!DOCTYPE html>
> <head>
> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
> <style type="text/css">
> <!--
> #navbar {
> width:400px;
> margin:0 auto;
> }
> li {
> float: left;
> list-style: none;
> }
> .right {
> float: right!important;
> }
> -->
> </style>
> </head>
> <body>
> <div id="navbar">
> <ul>
> <li>Hem </li>
> <li>Om mig </li>
> <li>Tjänster</li>
> <li class="right">Kontakt</li>
> <li class="right">Karta </li>
> </ul>
> </div>
> </body>
> </html>
> ```

Nice, men varför hamnar Kontakt och Karta i fel ordning?

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

## #8 — Danne V, 2011-10-17T21:27Z

> **[Travoni skrev:](https://www.webforum.nu/p/1541373)**
>
> Oki, nice. Lite fråga: varför använder man !important?

Används när man vill förhindra att andra stilar (som kommer "senare" och "närmare" html-koden) inte ska ta över. Man "låser" stilen så att den inte förändras.

Men som voigtann skriver, så behövs det antagligen inte men det spelar ingen roll om det sitter där heller.

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

## #9 — Danne V, 2011-10-17T21:29Z

> **[Travoni skrev:](https://www.webforum.nu/p/1541376)**
>
> Nice, men varför hamnar Kontakt och Karta i fel ordning?

För att dom är floatade. :-)
Kanske blir bättre med en "clear" emellan 3:e och 4:e och listelementet.
Annars får du väl byta plats med dom.

PS: Markera gärna svaret ovan som lösning om du tycker att det är det.

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

---

Tråden på webben: https://www.webforum.nu/amne/html-css/188106-ul-meny-med-både-float-left-och-right
