[CSS] Z-index vertikt het
Hallo iedereen,
Ik was bezig met de css voor mijn site. Maar ik had een probleem met divjes, daarom plaatste ik ze overelkaar heen en ik probeerde de z-index te gebruiken. Maar dat wil gewoon niet! Wat ik ook doe, niets lukt. Misschien weten jullie het?
URL:
http://www.wesselb.nl/new
CSS:
HTML:
Alvast bedankt, Wessel!
Ik was bezig met de css voor mijn site. Maar ik had een probleem met divjes, daarom plaatste ik ze overelkaar heen en ik probeerde de z-index te gebruiken. Maar dat wil gewoon niet! Wat ik ook doe, niets lukt. Misschien weten jullie het?
URL:
http://www.wesselb.nl/new
CSS:
Code (php)
1
2
3
4
5
6
7
8
9
10
11
2
3
4
5
6
7
8
9
10
11
#page
{
color: #fff;
background-color: #000;
height: 100%;
position: absolute;
top: 0;
left: 0;
margin: 0;
z-index: 1; /* <---- */
}
{
color: #fff;
background-color: #000;
height: 100%;
position: absolute;
top: 0;
left: 0;
margin: 0;
z-index: 1; /* <---- */
}
Code (php)
1
2
3
4
5
6
7
8
9
2
3
4
5
6
7
8
9
#header
{
margin: 0;
padding: 10px;
background-color: #fff;
height: 100px;
z-index: 2; /* <---- */
}
{
margin: 0;
padding: 10px;
background-color: #fff;
height: 100px;
z-index: 2; /* <---- */
}
HTML:
Code (php)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
<div id="header">
<div id="img">
<img src="img/star.jpg" alt="WesselB.nl!" id="img-pic">
<br />
<img src="img/txt.png" alt="WesselB.nl!" id="img-pic-2">
</div>
<div id="zoek">
<form action="zoeken.php" method="post">
<input type="text" id="zoek-balk" value="" onFocus="javascript:check_focus(this);" onBlur="javascript:check_blur(this);"><input type="submit" id="zoek-knop" value="">
</form>
</div>
</div>
<div id="gradient"></div>
<div id="page">
<div id="padd"><h1>Z-INDEX VERTIKT HET</h1>
</div>
</div>
<div id="img">
<img src="img/star.jpg" alt="WesselB.nl!" id="img-pic">
<br />
<img src="img/txt.png" alt="WesselB.nl!" id="img-pic-2">
</div>
<div id="zoek">
<form action="zoeken.php" method="post">
<input type="text" id="zoek-balk" value="" onFocus="javascript:check_focus(this);" onBlur="javascript:check_blur(this);"><input type="submit" id="zoek-knop" value="">
</form>
</div>
</div>
<div id="gradient"></div>
<div id="page">
<div id="padd"><h1>Z-INDEX VERTIKT HET</h1>
</div>
</div>
Alvast bedankt, Wessel!
Edit:
Aanvulling
De #header moet over de #page heen komen.
Aanvulling
De #header moet over de #page heen komen.
Gewijzigd op 01/01/1970 01:00:00 door Wessel Johnson
De header moet ook een position: abolute en een left en een top krijgen, anders werken z-indexen niet.
Ja! Het werkt! Bedankt Jan!




