Hallo zusammen
Ich habe einen div-Block, der ganz oben ist, 200 Pixel hoch und 100% breit, man sieht den Hintergrund nicht mehr.
Dieser Block ist fixiert, d.h er bleibt immer an Ort und Stelle.
Natürlich möchte ich noch einen Hauptblock machen, worauf dann auch der eigentliche Inhalt der Seite kommt.
Und da ist das Problem. Diesen Block möchte ich unter dem oberen Div-Block haben, wenn ich aber z.B top: 20%; schreibe, funktioniert das nicht, auch mit Pixel nicht. Mit margin-top: 20% funktioniert es leider auch nicht.
Der Hauptblock bleibt einfach immer ganz oben und wird immer von dem anderen Block bedeckt.
Ich habe bis jetzt alle html Probleme selbst gelöst, aber hier weiss ich einfach nicht weiter :(
Natürlich noch der Code :
So sieht die Seite mit diesem Code aus : High-Home
Würde mich sehr freuen, wenn ihr mir helfen könnt :)
Freundliche Grüsse
lufon
Ich habe einen div-Block, der ganz oben ist, 200 Pixel hoch und 100% breit, man sieht den Hintergrund nicht mehr.
Dieser Block ist fixiert, d.h er bleibt immer an Ort und Stelle.
Natürlich möchte ich noch einen Hauptblock machen, worauf dann auch der eigentliche Inhalt der Seite kommt.
Und da ist das Problem. Diesen Block möchte ich unter dem oberen Div-Block haben, wenn ich aber z.B top: 20%; schreibe, funktioniert das nicht, auch mit Pixel nicht. Mit margin-top: 20% funktioniert es leider auch nicht.
Der Hauptblock bleibt einfach immer ganz oben und wird immer von dem anderen Block bedeckt.
Ich habe bis jetzt alle html Probleme selbst gelöst, aber hier weiss ich einfach nicht weiter :(
Natürlich noch der Code :
HTML:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN">
<head>
<title>High-Home</title><script type="text/javascript" src="jquery-1.8.0.min.js"></script><script type="text/javascript" src="animatedcolors.js"></script><script src="js/lightbox.js"></script><link href="css/lightbox.css" rel="stylesheet" />
<style type="text/css">body{background-color: #1D1E21;margin: 0px;
}
div#bardiv{background-color: black;border-bottom: 1px solid gray;position: fixed;height: 130px;margin: 0px;
width: 100%;box-shadow:8px 8px 8px #000000;}
img#marg{margin: 10px;float: right;right: 0px;
}p#bar2{font-size: 20px;font-weight: bold;font-family:"Sans-serif", Arial, serif;color: white;}
div#barreg{margin-left: 80px;margin-top: 5px;float: left;width: 50px;height: 40px;background-color: black;}
div#main{background-color: black;top: 30%;width: 80%;height: 300px;border: 1px solid gray;
}</style>
<script type="text/javascript">
$(document).ready(function(){$('.1').mouseover(function(){$(this).animate({
marginTop: "3px"},200);
$('.1text').animate({color: '#fefb01'},200);
});
$('.1').mouseout(function(){$(this).animate({marginTop: "5px"},100);
$('.1text').animate({color: '#ffffff'},200);
});//-----------------------------------$('.2').mouseover(function(){$(this).animate({
marginTop: "3px"},200);
$('.2text').animate({color: '#fefb01'},200);
});
$('.2').mouseout(function(){$(this).animate({marginTop: "5px"},100);
$('.2text').animate({color: '#ffffff'},200);
});//--------------------------------------$('.3').mouseover(function(){$(this).animate({
marginTop: "3px"},200);
$('.3text').animate({color: '#fefb01'},200);
});
$('.3').mouseout(function(){$(this).animate({marginTop: "5px"},100);
$('.3text').animate({color: '#ffffff'},200);
});//--------------------------------------$('.4').mouseover(function(){$(this).animate({
marginTop: "3px"},200);
$('.4text').animate({color: '#fefb01'},200);
});
$('.4').mouseout(function(){$(this).animate({marginTop: "5px"},100);
$('.4text').animate({color: '#ffffff'},200);
});//----------------------------------------------$('.5').mouseover(function(){$(this).animate({
marginTop: "3px"},200);
$('.5text').animate({color: '#fefb01'},200);
});
$('.5').mouseout(function(){$(this).animate({marginTop: "5px"},100);
$('.5text').animate({color: '#ffffff'},200);
});});
</script>
</head>
<body>
<div id="bardiv"><img id="marg" width="200" height="110" src="icontitle.png" align="right">
<!--BAR--><a href="http://hhome.lufon.net"><div class="1" id="barreg"><p class="1text" id="bar2">Home</p></div></a>
<a href="http://hmain.lufon.net"><div class="2" id="barreg"><p class="2text" id="bar2">Main</p></div></a>
<a href="http://hpic.lufon.net"><div class="3" id="barreg"><p class="3text" id="bar2">Pics</p></div></a>
<a href="http://hvid.lufon.net"><div class="4" id="barreg"><p class="4text" id="bar2">Videos</p></div></a>
<a href="http://lufon.net"><div class="5" id="barreg"><p class="5text" id="bar2">lufon.net</p></div></a><!--FINISH BAR-->
</div>
<div id="main"><!--dieser block kann nicht mit top verstellt werden--></div>
</body>So sieht die Seite mit diesem Code aus : High-Home
Würde mich sehr freuen, wenn ihr mir helfen könnt :)
Freundliche Grüsse
lufon
