blackshadow3
Grünschnabel
Hallo ihr lieben,
ich google mich nun schon seit einer ganzen Weile durchs Web, und suche entweder nach den falschen Begriffen, oder es ist schlichtweg nicht möglich. Zumindest bin ich bisher nicht fündig geworden.
Zur Sache: Was habe ich vor? Unzwar ich wollte eine Webseite auf Div-Basis aufbauen und dabei keine feste Breite sondern die volle Breite des Bildschirms nutzen. Dazu habe ich zwei Divs für mein Banner, eines für mein Menü und eines für den Inhalt. Das für das Menü soll eine fixe Breite von 160px haben und das für den Inhalt soll bis zum Ende des Bildschirms ausgeweitet werden. Dazu habe ich bisher folgenden Code:
Mein Problem hierbei ist es nun, dass sich #site nur bis zur max. Breite des Banners ausweitet. Alle Möglichkeiten die ich bisher sonst gefunden habe führen dazu, dass #site über den Bildschirmrand (meist exakt um 160 Pixel wie das Menü) hinausragt. Hat dazu vielleicht jemand eine Idee?
Ein Beispiel dazu wie es dann aussehen könnte wäre Wikipedia, abgesehen davon dass dort das Banner fehlt. Allerdings ist Wikipedia wiederum so komplex aufgebaut, dass man da auf die Schnelle nicht durchsteigt.
Vielen Dank schonmal im Voraus
Gruß
BS
PS: Ich arbeite leider nicht all zu häufig mit HTML und CSS, deshalb fehlt mir da etwas die Erfahrung.
ich google mich nun schon seit einer ganzen Weile durchs Web, und suche entweder nach den falschen Begriffen, oder es ist schlichtweg nicht möglich. Zumindest bin ich bisher nicht fündig geworden.
Zur Sache: Was habe ich vor? Unzwar ich wollte eine Webseite auf Div-Basis aufbauen und dabei keine feste Breite sondern die volle Breite des Bildschirms nutzen. Dazu habe ich zwei Divs für mein Banner, eines für mein Menü und eines für den Inhalt. Das für das Menü soll eine fixe Breite von 160px haben und das für den Inhalt soll bis zum Ende des Bildschirms ausgeweitet werden. Dazu habe ich bisher folgenden Code:
Code:
<!DOCTYPE html
PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<?xml version="1.0" encoding="ISO-8859-1"?>
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1" />
<script type="text/javascript" src="script.js"></script>
<script type="text/javascript" src="style.css"></script>
<link rel="stylesheet" type="text/css" href="style.css" />
<link rel="SHORTCUT ICON" href="gfx/favicon.ico" />
<title></title>
<style type="text/css">
body {
background: #f6f6f6;
height: 100%;
width: 100%;
margin: 0;
padding: 0;
font-family: sans-serif;
font-size: 1em;
}
#cube {
display: block;
position: absolute;
top: 0px;
left: 0px;
width: 160px;
height: 167px;
background-image: url(gfx/cube.jpg);
}
#menu {
display: block;
position: absolute;
top: 167px;
left: 0px;
width: 160px;
}
#banner {
display: block;
position: absolute;
top: 0px;
left: 160px;
width: 643px;
height: 147px;
background-image: url(gfx/banner.jpg);
}
#site {
display: block;
position: absolute;
width: 100%;
top: 147px;
left: 160px;
background: #ffffff;
border: solid 1px #a7d7f9;
border-right: solid 0px #ffffff;
float: left;
overflow:auto;
}
</style>
</head>
<body>
<div id="cube" />
<div id="menu">
%Menü%
</div>
<div id="banner" />
<div id="site">
<table width="100%">
<tr>
<td>
%Inhalt%
</td>
</tr>
</table>
</div>
</body>
</html>
Mein Problem hierbei ist es nun, dass sich #site nur bis zur max. Breite des Banners ausweitet. Alle Möglichkeiten die ich bisher sonst gefunden habe führen dazu, dass #site über den Bildschirmrand (meist exakt um 160 Pixel wie das Menü) hinausragt. Hat dazu vielleicht jemand eine Idee?
Ein Beispiel dazu wie es dann aussehen könnte wäre Wikipedia, abgesehen davon dass dort das Banner fehlt. Allerdings ist Wikipedia wiederum so komplex aufgebaut, dass man da auf die Schnelle nicht durchsteigt.
Vielen Dank schonmal im Voraus
Gruß
BS
PS: Ich arbeite leider nicht all zu häufig mit HTML und CSS, deshalb fehlt mir da etwas die Erfahrung.
Zuletzt bearbeitet: