---
title: "Diven följer inte hela vägen..."
type: "forum-thread"
url: "https://www.webforum.nu/amne/html-css/86037-diven-följer-inte-hela-vägen"
topic: "HTML & CSS"
topic_url: "https://www.webforum.nu/amne/html-css"
author: "GrodanBoll"
published: "2003-09-15T12:21:02.000Z"
updated: "2003-09-15T17:19:56.000Z"
replies: 3
views: 378
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/86037-diven-följer-inte-hela-vägen"
---

# Diven följer inte hela vägen...

## #1 — GrodanBoll, 2003-09-15T12:21Z

Hej hej

Jag sitter och testar lite med CSS och försöker bygga upp sidan utan för mkt tabeller.
Dock så får jag lite strul med min vertikala div:s höjd. Den funkar fint om jag inte har med mina main-divar, då är den 100%. Men när jag lägger till mina main-divar så breder den inte ut sig hela vägen ner.

Vad e det för fel? :q

```
<html>
<head>
<title>Test1 - testar lite CSS-krabb</title>

<style type="text/css">
<!-- 
	body 
	{
		font-family: Tahoma, Verdana; 
		font-size: 12px;
	}
	
	#horisontal
	{
		position: absolute;
		left: 0px;
		top: 30px;
		height: 50px;
		width: 700px;
		background: #cccccc;
	}

	#vertikal
	{
		position: absolute;
		left: 600px;
		top: 0px;
		height: 100%;
		width: 50px;
		background: #cccccc;
	}

	#menu
	{
		position: absolute;
		left: 605px;
		top: 110px;
		height: auto;
		width: 40px;
		overflow: hidden;
		font-size: 10px;
	}
	
	#main-left
	{
		position: absolute;
		left: 10px;
		top: 110px;
		height: 100%;
		width: 450px;
	}

	#main-right
	{
		position: absolute;
		left: 470px;
		top: 110px;
		height: 100%;
		width: 100px;
	}

-->
</style>

</head>
<body>
<div id="horisontal">
</div>
<div id="vertikal">
</div>
<div id="menu">
asdasd sjdklj j åä adöpåä ldap as lååååångtordsomsäkertintefårplats
</div>
<div id="main-left">
Main vänster...
</div>
<div id="main-right">
Main höger...
</div>

</body>
</html>
```

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

## #2 — jarvklo, 2003-09-15T12:39Z

När du kör med absolut positionering sådär, så är height:100% i höjd samma sak som 100% av webbläsarfönstrets höjd...

Du "petar ner" dina två main 110px med absolut positionering och **top:110px** vilket gör att dessa två:s underkanter hamnar på "110px + den höjd din webbläsare råkar ha" samtidigt som din #vertiklal ligger på "0px + webbläsarfönstrets höjd" - vilket ger att dess underkant inte hamnar "lika långt ner" som de andra två...

Detta \*är\* knepigt - jag har ännu inte sett någon \*enkel\* lösning på det du försöker göra i "ren" CSS (dvs utan att man måste peta in en massa"container-div:ar" och annan extra HTML-kod för att få det att funka med "enbart CSS" ;) - Tabeller \*är\* fortfarande ett användbart alternativ för det du ser ut att vara ute efter, även om det medför en större risk att man då knepar till tillgängligheten för de som är beroende av skärmuppläsare ;)

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

## #3 — GrodanBoll, 2003-09-15T13:26Z

Hmm... ok. 
Tack för svaret. :)

Kan man kanske kombinera en div (nuvarande 'horisontal') samt en bild (som ersätter div:en 'vertikal') som man har som bakgrund i bodytaggen?

Då kan man fortfarande använda css och slipper tabeller för designen. Kan det vara någe?

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

## #4 — jarvklo, 2003-09-15T17:19Z

Jajjemän - bakgrundsbilder i underliggande "lager" (body i detta fall) är ett mycket använt sätt att ta sig förbi detta hinder. Testa med et och fråga igen om du stöter på patrull - du är inte ensam om att slåss med detta som sagt ;)

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

---

Tråden på webben: https://www.webforum.nu/amne/html-css/86037-diven-följer-inte-hela-vägen
