---
title: "lägga 3 div på rad"
type: "forum-thread"
url: "https://www.webforum.nu/amne/html-css/62097-lägga-3-div-på-rad"
topic: "HTML & CSS"
topic_url: "https://www.webforum.nu/amne/html-css"
author: "andreas_lindh"
published: "2002-12-13T19:57:58.000Z"
updated: "2002-12-16T06:00:49.000Z"
replies: 13
views: 380
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/62097-lägga-3-div-på-rad"
---

# lägga 3 div på rad

## #1 — andreas_lindh, 2002-12-13T19:57Z

Försöker få 3 divar att ligga på rad men det blir inte riktigt som jag tänkt
Det ser ut så här

```
div 1 div2
                div3
```

koden

```
<div class="rubriker1">Test</div><div class="rubriker2">Test2</div><div class="rubriker3">test3</div>
```

css klasserna

```
.rubriker1 {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 11px;
	font-weight: bold;
	color: #000000;
	text-decoration: none;
	background-image: url(../grafik/top_back.gif);
	height:26px;
	vertical-align: bottom;
	padding:0px;
	width:150px;
	float:left;
	margin:0px;
}
.rubriker2 {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 11px;
	font-weight: bold;
	color: #000000;
	text-decoration: none;
	background-image: url(../grafik/top_back.gif);
	height:26px;
	vertical-align: top;
	padding:0px;
	width:450px;
	margin-left:150px;
}
.rubriker3 {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 11px;
	font-weight: bold;
	color: #000000;
	text-decoration: none;
	background-image: url(../grafik/top_back.gif);
	height:26px;
	vertical-align: top;
	padding:0px;
	width:150px;
	float:right;
	margin:0px;
}
```

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

## #2 — icaaq, 2002-12-13T20:03Z

Måste du ha divar? testa med att använda spans istället :)

mvh icaaq

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

## #3 — andreas_lindh, 2002-12-13T20:15Z

Testad emed spans. Då blir det som på den bifogade bilden

visar lita mer kod

```
<div style="width:100%;height:100%;">
	 <div class="main">
	 	<div class="top">
			Toppen
		</div>
		<div class="meny">
			<span class="rubriker1">Test</span><span class="rubriker2">Test2</span><span class="rubriker3">test3</span>
		</div>
	 </div>
</div>
```

Bilagor:

- [fel.gif](https://www.webforum.nu/a/815.gif)

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

## #4 — icaaq, 2002-12-13T21:26Z

Om jag har förstått dig rätt är det så här du vill ha det

```
[red]
.rubriker1 {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 11px;
	font-weight: bold;
	color: #000000;
	text-decoration: none;
	background-image: url(../grafik/top_back.gif);
	height:26px;
	vertical-align: bottom;
	padding:0px;
	width:25%;
	margin:0px;
}
.rubriker2 {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 11px;
	font-weight: bold;
	color: #000000;
	text-decoration: none;
	background-image: url(../grafik/top_back.gif);
	height:26px;
	vertical-align: top;
	padding:0px;
	width:50%;
}
.rubriker3 {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 11px;
	font-weight: bold;
	color: #000000;
	text-decoration: none;
	background-image: url(../grafik/top_back.gif);
	height:26px;
	vertical-align: top;
	padding:0px;
	width:25%;
	margin:0px;
}
[/red]
```

mvh icaaq

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

## #5 — icaaq, 2002-12-13T21:28Z

En sak till så skulle jag avråda dig att ha underscore (\_) i bildens sökväg vid background-image. Då NS inte vill acceptera det......

mvh icaaq

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

## #6 — andreas_lindh, 2002-12-13T21:29Z

nu lägger dom sig på rad men dom blir bara lika breda som texten som finns i dom

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

## #7 — andreas_lindh, 2002-12-13T21:30Z

> En sak till så skulle jag avråda dig att ha underscore (\_) i bildens sökväg vid background-image. Då NS inte vill acceptera det......

Tack för tipset.  :)

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

## #8 — icaaq, 2002-12-13T21:31Z

Hur ser classen meny ut?

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

## #9 — andreas_lindh, 2002-12-13T21:32Z

```
.meny {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 11px;
	font-weight: bold;
	color: #000000;
	text-decoration: none;
	height:26px;
	vertical-align: bottom;
	padding:0px;
	background-color: transparent;
}
```

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

## #10 — icaaq, 2002-12-13T21:35Z

Och main?

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

## #11 — andreas_lindh, 2002-12-13T21:36Z

```
.main {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 11px;
	color: #000000;
	text-decoration: none;
	background-color: #ffffff;
	width:770px;
	height:100%;
	margin:auto;
}
```

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

## #12 — andreas_lindh, 2002-12-14T11:06Z

löste det. La till float:left; på runbrik1, 2 och 3

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

## #13 — Pace, 2002-12-15T19:16Z

> **icaaq skrev:**
>
> En sak till så skulle jag avråda dig att ha underscore (\_) i bildens sökväg vid background-image. Då NS inte vill acceptera det......
> 
> mvh icaaq

Enkelfnuttar (') runt sökvägen löser väl det problemet?

```
background-image: url('../grafik/top_back.gif');
```

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

## #14 — icaaq, 2002-12-16T06:00Z

> **Pace skrev:**
>
> > **icaaq skrev:**
> >
> > En sak till så skulle jag avråda dig att ha underscore (\_) i bildens sökväg vid background-image. Då NS inte vill acceptera det......
> > 
> > mvh icaaq
>
> 
> 
> Enkelfnuttar (') runt sökvägen löser väl det problemet?
> 
>
>
> ```
> background-image: url('../grafik/top_back.gif');
> ```

Jag har själv inte varit med om detta men jag har läst några trådar och andra inlägg i andra disskusionsforum att fnuttar inte räcker...

<http://www.webforum.nu/showthread.php?s=&threadid=60377>

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

---

Tråden på webben: https://www.webforum.nu/amne/html-css/62097-lägga-3-div-på-rad
