Ich habe ein Problem. Und zwar möchte ich mehrere DIV Boxen ineinander haben .. aber irgendwie will es nicht so wie ich es will ... die übergeordnete box soll den hintergrund erstellen und die untergeordnete ist für den textinhalt zuständig.
Die CSS Datei:
body {
background-color: #C0C0C0;
color: #000000;
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 12pt;
}
a {
color: #FF0000;
text-decoration: none;
}
a:visited {
color: #FF0000;
}
a:hover {
color: #800000;
}
#head {
position: absolute;
left: 20px;
top: 20px;
height: 300px;
width: 1024px;
background-image: url(img/header.png);
background-repeat: no-repeat;
border: 1xp solid;
}
ul#navi {
position:absolute ;
top: 250px;
left: 20px;
width: 982px;
height:53px;
/* border: 1px solid; */
list-style-type:none;
}
ul#navi li {
padding: 1px 2px 0px 0px;
height: 50px;
float:left;
list-style-type: none;
}
ul#navi a {
/* display: block;*/
padding: 18px 50px 0px 50px;
text-decoration: none;
float:left;
color: #fff;
height: 45px;
font-size: 13px;
}
ul#navi a:hover {
background: url(img/hover.png) repeat-x;
text-decoration: none;
}
#left {
position: absolute;
left: 20px;
top: 320px;
width: 230px;
border-right: 1px solid;
/*border: 1px solid;*/
}
img#top {
position:absolute;
left:250px;
top:322px;
width:800px;
height: 18px;
}
#content {
position:absolute;
left:250px;
top:340px;
width:800px;
background-image: url(img/bg.png);
background-repeat: repeat-y;
/*border: 1px solid;*/
}
#inside {
position: absolute;
left:10px;
top:18px;
width: 750px;
border: 1px solid;
}
Die HTML/PHP datei
<!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">
<head>
<link rel="stylesheet" href="style.css" type="text/css" />
<!--<title></title>-->
</head>
<body>
<div id='head'></div>
<? include("navi.htm"); ?>
<div id='left'><? include("left.htm"); ?></div>
<img id='top' src="img/top.png" width="800" height="18" border="0" alt="" />
<div id='content'>
<div id='inside'>
<?php
if (!isset($_GET[id]))
{
echo "
<head><title>EFO - Home/Neuigkeiten</title></head>
<h1>EFO-WEB.DE</h1>
";
}
if ($_GET[id] == 1) {include("pictures.htm");}
if ($_GET[id] == 2) {include("kontakt.htm");}
if ($_GET[id] == 3) {include("anfahrt.htm");}
if ($_GET[id] == 4) {include("impressum.htm");}
?>
</div>
<!--<img src="img/bottom.png" width="800" height="20" border="0" alt="" />-->
</div>
</body>
</html>
ich bekomme zwar den textinhalt aber er befindet sich nicht an der stelle wie ich will und in #inside angegeben habe.