Inselbewohner
Neues Mitglied
Hallo zusammen,
ich habe gerade angefangen eine Website zu bauen und stehe vor folgendem Problem.
Ich habe ein Header div mit zweimal dem gleichen Bild und darunter habe
ich ein Content div gemacht und in dieses einen linken Rand gelegt. Nun möchte ich daneben eine Navigationsleiste einfügen.
Ich möchte nun erreichen, dass die Navigationsleiste sich dem Headerbereich anpasst. Ich habe mir schon überlegt, dass man sich vllt irgendwie die Pixelweite des Bildschirms holen kann und des dann als Breite angibt. (1.Idee als Java Programmierer) aber verträgt sich css mit Java Script. Des kann ich mir net vorstellen und anders wüsste ich net, wie man sich die aktuelle Bildschirmbreite holen kann.
ich habe gerade angefangen eine Website zu bauen und stehe vor folgendem Problem.
Ich habe ein Header div mit zweimal dem gleichen Bild und darunter habe
ich ein Content div gemacht und in dieses einen linken Rand gelegt. Nun möchte ich daneben eine Navigationsleiste einfügen.
Ich möchte nun erreichen, dass die Navigationsleiste sich dem Headerbereich anpasst. Ich habe mir schon überlegt, dass man sich vllt irgendwie die Pixelweite des Bildschirms holen kann und des dann als Breite angibt. (1.Idee als Java Programmierer) aber verträgt sich css mit Java Script. Des kann ich mir net vorstellen und anders wüsste ich net, wie man sich die aktuelle Bildschirmbreite holen kann.
HTML:
<style type="text/css">
<!--
#header {
background-color: #3CC;
height: 120px;
position: relative;
background-image: url(rauten3.jpg);
background-repeat: repeat;
}
#logo {
background-color: #639;
height: 120px;
width: 175px;
position: absolute;
right: 0px;
background-image: url(bayern120.jpg);
background-repeat: no-repeat;
top: 0px;
}
#content {
background-color: #0F0;
height: 500px;
position: relative;
}
#linkerRand {
height: 500px;
width: 175px;
background-image: url(rauten3.jpg);
position: relative;
bottom: 0px;
float: none;
}
#navigation {
background-color: #FFF;
height: 48px;
position: absolute;
width: 703px;
left: 178px;
top: 0px;
}
#logoLinks {
background-image: url(bayern120.jpg);
height: 120px;
width: 175px;
}
-->
</style>
</head>
<body>
<div id="header">
<div id="logoLinks"></div>
<div id="logo"></div>
</div>
<div id="content">
<div id="navigation">frgrf </div>
<div id="linkerRand"> </div>
</div>
</body>
</html>
Zuletzt bearbeitet: