Hallo!
Ich bin schon seit mehreren Tagen dabei, meine Hompage in CSS einzukleiden, was mir jedoch ums verrecken nicht gelingen will.
Ich habe unter anderem erstmal versucht mein mit Photoshop erstelltes Design in Fireworks zu Slicen und dann in Dreamweaver weiter zu verarbeiten. Jedoch kam ich damit nicht zurecht.
Ich zeige euch hier einmal mein Grundgerüst (Design):
und hier mein bisheriger Code:
und die CSS Datei:
Der Header-Bereich, die Such Box+Button bekomme ich ohne weiteres mit CSS hin.
Meine Frage ist Folgende: Wie würdet ihr an das Design weier herangehen?
Problem: Der Content-Bereich muss dynamisch an die Größe angepasst werden und der Rand rechts und links auch, jedoch seht ihr im Design, dass der Schatten des linken Content-Rand erst unter der Navigation anfängt!
Der Navigationsrand soll auch dynamisch zur Anzahl der Links vergrößert/verkleinert werden.
Ich hoffe meine Problembeschreibung war ausreichend. Ich bedanke mich im Voraus für nützliche Antworten!
Ich bin schon seit mehreren Tagen dabei, meine Hompage in CSS einzukleiden, was mir jedoch ums verrecken nicht gelingen will.
Ich habe unter anderem erstmal versucht mein mit Photoshop erstelltes Design in Fireworks zu Slicen und dann in Dreamweaver weiter zu verarbeiten. Jedoch kam ich damit nicht zurecht.
Ich zeige euch hier einmal mein Grundgerüst (Design):
und hier mein bisheriger Code:
HTML:
<body>
<div id="slider"></div>
<div id="wrapper">
<div id="header"></div>
<div id="main">
<div id="border_left"></div>
<div id="navi"></div>
<div id="content">
</div>
<div id="border_right">
</div>
</div>
<div id="clear"></div>
<div id="footer">
<div id="footer_left">Copyright by X......</div>
<div id="footer_right">Blog | faq | Kontakt | Datenschutz | AGB | Impressum</div>
</div>
</div>
</body>und die CSS Datei:
HTML:
@charset "utf-8";
body {
margin: 0;
padding: 0;
}
#slider {
}
/* CSS Document */
#wrapper {
width: 980px;
margin: 0 auto;
padding: 0;
min-height:100%;
height:auto !important;
height:100%;
position: relative;
}
/* CSS Document */
#header {
width: 980px;
margin: 0 auto;
padding: 0;
height: 100px;
}
/* CSS Document */
#main {
width: 980px;
margin: 0 auto;
padding: 0;
}
#border_left {
float: left;
width: 5px;
}
#navi {
float: left;
width: 200px;
}
#content {
float: left;
width: 770px;
}
#border_right {
width: 5px;
float: left;
}
#clear {
clear: both;
}
/* CSS Document */
#footer {
width: 980px;
margin: 0 auto;
padding: 0;
height: 50px;
}
#footer_left {
float: left;
}
#footer_right {
float: right;
}Der Header-Bereich, die Such Box+Button bekomme ich ohne weiteres mit CSS hin.
Meine Frage ist Folgende: Wie würdet ihr an das Design weier herangehen?
Problem: Der Content-Bereich muss dynamisch an die Größe angepasst werden und der Rand rechts und links auch, jedoch seht ihr im Design, dass der Schatten des linken Content-Rand erst unter der Navigation anfängt!
Der Navigationsrand soll auch dynamisch zur Anzahl der Links vergrößert/verkleinert werden.
Ich hoffe meine Problembeschreibung war ausreichend. Ich bedanke mich im Voraus für nützliche Antworten!
Zuletzt bearbeitet:
