Hallo alle zusammen,
ich spiel grad ein bisschen mit divs herum und hab bei zwei Sachen Probleme.
Beim 1. Fall würde ich gerne die Anzeige der Scrollleisten verhindern. Hier der Code.
<html>
<head>
<style type="text/css">
#ebene1 {
position:absolute;
}
#ebene2 {
position:absolute;
}
#shadow{
position:relative;
width:800px;
height:600px;
background-color:#F0F4D6;
border:1px solid #000000;
}
#head{
position:relative;
width:950px;
height:80px;
background-color:#F0F4D6;
border:1px solid #000000;
top:-602px;
}
#links{
position:relative;
top:-580px;
left:-415px;
width:120px;
height:220px;
background-color:#F0F4D6;
border:1px solid #000000;
}
#meistGemietet{
position:relative;
top:-802px;
width:600px;
height:150px;
background-color:#F0F4D6;
border:1px solid #000000;
}
#mitte{
position:relative;
top:-780px;
width:600px;
height:300px;
background-color:#F0F4D6;
border:1px solid #000000;
}
#rechts{
position:relative;
left:+415px;
top:-1256px;
width:120px;
height:220px;
background-color:#F0F4D6;
border:1px solid #000000;
}
</style>
</head>
<body>
<div align="center" valign="middle" >
<div>
<div id="shadow">hintergrund</div>
</div>
<div>
<div id="head">kopf</div>
<div id="links">testMenüLinks</div>
<div id="meistGemietet">Meist</div>
<div id="mitte">mitte</div>
<div id="rechts">rechts</div>
</div>
</div>
</body>
</html>
Wie kann ich das machen?
Beim 2. Fall wird das Bild nicht angezeigt:
<html>
<head>
<style type="text/css">
body{
background-color:f0f0f0;
font-family:Arial;
font-size: 12px;
}
#ebene1 {
position:absolute;
}
#ebene2 {
position:absolute;
}
#shadow{
position:relative;
width:800px;
height:600px;
background-color:#e1e1e1;
border:1px solid #000000;
}
#head{
position:relative;
width:950px;
height:70px;
background-color:#cadef8;
border:1px solid #000000;
top:-602px;
}
#links{
position:relative;
top:-580px;
left:-395px;
width:160px;
height:220px;
background-color:#ffffff;
border:1px solid #000000;
}
#eSuche{
position:relative;
top:-560px;
left:-395px;
width:160px;
height:50px;
background-color:#ffffff;
border:1px solid #000000;
}
#meistGemietet{
position:relative;
top:-852px;
width:600px;
height:150px;
background-color:#ffffff;
border:1px solid #000000;
}
#mitte{
position:relative;
top:-830px;
width:600px;
height:300px;
background-color:#ffffff;
border:1px solid #000000;
}
#rechts{
position:relative;
left:+395px;
top:-1306px;
width:160px;
height:220px;
background-color:#ffffff;
border:1px solid #000000;
}
div.navi{
height: 25px;
width:120px;
background-color:#cadef8;
border:1px solid #000000;
margin: 5px 5px 5px 5px;
backgound-image:url(button.jpg)
}
div.rand{
width:140px;
background-color:#b3b3b3;
border: 1.9px dashed #000000;
margin: 5px 5px 5px 5px;
}
div.button{
backgound-image:url(button.jpg);
}
</style>
</head>
<body>
<div align="center">
<div>
<div id="shadow">hintergrund</div>
</div>
<div>
<div id="head">
<div> logo</div>
<div> text</div>
</div>
<div id="links">
<div class="rand">
<div class="navi">Link</div>
<div class="navi">Link</div>
</div>
<div class="rand">
<div class="navi">Link</div>
<div class="navi">Link</div>
</div>
</div>
<div id="eSuche">
<div class="rand">
<div class="button">Link</div>
</div>
</div>
<div id="meistGemietet">Meist</div>
<div id="mitte">mitte</div>
<div id="rechts">
<div class="rand">
<div class="navi">Link</div>
<div class="navi">Link</div>
</div>
</div>
</div>
</div>
</body>
</html>
Was hab ich falsch gemacht?