---
title: "Påverka div#2's bakgrund m h a :hover i div#1"
type: "forum-thread"
url: "https://www.webforum.nu/amne/html-css/128292-påverka-div-2-s-bakgrund-m-h-a-hover-i-div-1"
topic: "HTML & CSS"
topic_url: "https://www.webforum.nu/amne/html-css"
author: "joel_sundkvist"
published: "2005-05-15T22:16:24.000Z"
updated: "2005-05-16T00:39:42.000Z"
replies: 3
views: 362
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/128292-påverka-div-2-s-bakgrund-m-h-a-hover-i-div-1"
---

# Påverka div#2's bakgrund m h a :hover i div#1

## #1 — joel_sundkvist, 2005-05-15T22:16Z

Jag har suttit och lekt lite med möjlligheten att byta bakgrund i div#2 vid hover på div#1 utan att använda javascript. Har nu kört fast rejält. Är det någon som vet om detta överhuvudtaget är möjligt?

Tacksam för svar! :)

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

## #2 — azvareth, 2005-05-15T23:00Z

kan inte svara på rak arm (tror det har att göra med huruvida div#1 är barn eller syster med div#2) mer hjälp kan du kanske finna här:
<http://css.maxdesign.com.au/selectutorial/>

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

## #3 — joel_sundkvist, 2005-05-15T23:34Z

Jo, så långt är jag med men jag får det inte att gå ihop i praktiken. 

Det känns som jag sökt igenom hela internet efter detta. ;)

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

## #4 — joel_sundkvist, 2005-05-16T00:39Z

Nu börjar saker och ting klarna lite... :=

```
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
	"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="sv">
	<head>
		<meta http-equiv="content-type" content="text/html; charset=utf-8" />
		<title>:hover-test</title>
<style type="text/css">
* {margin:0; padding:0;}
html, body {
behavior:url("csshover.htc");
}

body{margin:100px 0 0 0;padding:0;
}

#container {
width: 750px;
margin:0 auto;
background: #ccc;
}

#meny01, #meny02, #meny03, #meny04, #meny05 {width:150px; height:30px; background:yellow;float:left;text-align:center;line-height:30px;}

#meny01_over {width:750px; height:100px; margin:-130px 0 0 0;}

#meny01 #meny01_over { display: none; }
#meny01:hover #meny01_over { display: block; background:red; }

#meny02_over {width:750px; height:100px; margin:-130px 0 0 -150px;}

#meny02 #meny02_over { display: none; }
#meny02:hover #meny02_over { display: block; background:orange; }

#meny03_over {width:750px; height:100px; margin:-130px 0 0 -300px;}

#meny03 #meny03_over { display: none; }
#meny03:hover #meny03_over { display: block; background:purple; }

#meny04_over {width:750px; height:100px; margin:-130px 0 0 -450px;}

#meny04 #meny04_over { display: none; }
#meny04:hover #meny04_over { display: block; background:black; }

#meny05_over {width:750px; height:100px; margin:-130px 0 0 -600px;}

#meny05 #meny05_over { display: none; }
#meny05:hover #meny05_over { display: block; background:silver; }

 </style>
</head>

<body>
<div id="container">
	
<div id="meny01">
<a href="#">div 1</a>
	<div id="meny01_over"></div>
</div>

<div id="meny02">
<a href="#">div 2</a>
	<div id="meny02_over"></div>
</div>

<div id="meny03">
<a href="#">div 3</a>
	<div id="meny03_over"></div>
</div>

<div id="meny04">
<a href="#">div 4</a>
	<div id="meny04_over"></div>
</div>

<div id="meny05">
<a href="#">div 5</a>
	<div id="meny05_over"></div>
</div>
<br style="clear:both;" />
</div>
	</body>
</html>
```

 

Detta verkar funkar i Firefox och safari. Med .htc-filen fungerar hovern även i MSIE även om denna browser kalkylerar bredden på elementet fel (pga. margins)

Hjälp gärna till att utveckla detta vansinne ytterligare ;)

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

---

Tråden på webben: https://www.webforum.nu/amne/html-css/128292-påverka-div-2-s-bakgrund-m-h-a-hover-i-div-1
