---
title: "Hjälp med Div:ar och bakgrundsrepeat."
type: "forum-thread"
url: "https://www.webforum.nu/amne/html-css/156959-hjälp-med-div-ar-och-bakgrundsrepeat"
topic: "HTML & CSS"
topic_url: "https://www.webforum.nu/amne/html-css"
author: "ConnyFox"
published: "2007-02-08T16:48:32.000Z"
updated: "2007-02-12T12:29:15.000Z"
replies: 4
views: 493
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/156959-hjälp-med-div-ar-och-bakgrundsrepeat"
---

# Hjälp med Div:ar och bakgrundsrepeat.

## #1 — ConnyFox, 2007-02-08T16:48Z

har ett problem med min sida.. allt fungerar hur bra som helst i samtliga webbläsare förutom två div:ar med bakgrundsbild som vägrar gå hela vägen!

```
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
	<title></title>
<meta name="generator" content="TSW WebCoder" />
<link rel="stylesheet" href="stylesheet.css" />
</head>

<body>

<div style="display: block; width: 737px; min-height: 100%;">

[red]<div class="border_left"><img src="img/border_left.gif" alt="" /></div>[/red]
<div style="float: left; display: table-cell; min-height: 100%;">
<div class="border_top"><img src="img/logo_shadow.gif" alt="" /></div>

<div style="width: 707px; background-color: #FFFFFF; display: table-row; min-height: 100%;">

<div style="float: left; width: 526px; padding: 10px; display: table-cell">

<div class="boej">&nbsp; &nbsp;Nyheter</div>
<div class="nyhets_text">
-->Innehåll!<--

</div>

</div>

</div>
</div>
[red]<div class="border_right"><img src="img/border_right.gif" alt="" /></div>[/red]

<div>
<div style="float: left; width: 21px; height: 40px;"><img src="img/bottom_left.gif" alt="" /></div>
<div style="float: left; width: 692px; height: 40px; background-image: url(img/bottom_bg.gif);"></div>
<div style="float: left; width: 24px; height: 40px;"><img src="img/bottom_right.gif" alt="" /></div>
</div>

</div>
</body>
</html>
```

det är alltså dom rödmarkerade div:arna där bakgrundsbilden (i css:en) vägrar gå hela vägen vad jag än gör.

Här är css:en för dom båda.

```
.border_left {
		float: left; width: 13px; min-height: 100%; background-image: url(img/border_left_bg.gif); vertical-align: top;
}

.border_right {
		float: left; width: 17px; min-height: 100%; background-image: url(img/border_right_bg.gif); vertical-align: top;
}
```

Sätta höjd till 100% fungerar alltså inte. =/

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

## #2 — ConnyFox, 2007-02-09T14:00Z

Ingen som kunde detta nej :D blir väll och koda om till tråkiga tabeller då.. =/

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

## #3 — silfver, 2007-02-09T14:37Z

Kan du inte ge en länk till din hemsida, eller visa en skärmdump. Hur mycket saknas? Har du satt margin: 0; padding: 0; på body?

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

## #4 — caya, 2007-02-12T11:59Z

tänk inte på tabeller nu... tänk vad du vill åstadkomma

```
<div id="container">
  <div id="logo">
    <h1>Webbadress.com</h1>
  </div>

  <div id="content">
    <h2 class="nyheter">Nyheter</h2>
      <p class="nyhets_text">--&gt;Innehåll!&lt;--</p>
  </div>

  <div id="footer">
    <small>&copy; Whatever &amp; Whomever</small>
  </div>

</div>
```

börjar skissa lite på en passande css... ta över och tänk igenom...
bakgrundsbilderna med de skuggande ramarna läggs i container, den övre i loggan, den nedre i footern. det behöver inte vara svårare än så...

```
* { margin:0; padding:0; }
body {
text-align:center;
font:11px/17px Verdana, Arial, Helvetica, sans-serif;
background:#fff;
color:#000;
}
#container {
width: 737px; margin:0 auto;
background:#fff url(img/border_bg.gif) top left repeat-y;
text-align:left;
}
#logo {
background:url(img/logo_shadow.gif) no-repeat;
height:150px;
width:737px;
}
#logo h1 {
position:absolute; top:0; left:-9000px;
}
#content {
float:left; 
width:526px; 
padding:10px;
}
#footer {
background:url(img/footer_bg.gif) bottom left no-repeat;
height:30px; width:737px;
}
```

mer om faux columns...
<http://www.webforum.nu/showthread.php?t=153425>

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

## #5 — SuPeR_ToBBe, 2007-02-12T12:29Z

För att göra som du tänkt från början, testa att sätta **height: 100%** på body och html

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

---

Tråden på webben: https://www.webforum.nu/amne/html-css/156959-hjälp-med-div-ar-och-bakgrundsrepeat
