Div aufbauen
0 0 0 
Felix Riesterer
Div aufbauen
Hi Leute ich hätte eine Frage und zwar:
Ich habe eine Seite aufgebaut komplett mit div-Elementen
Hier mein Code:
#impressum{
background-image:url(Bilder/bg_impressum.gif);
background-repeat:repeat-x;
width:910px;
height:28px;
}
#header {
height: 218px;
width: 859px;
background-color: #000000;
text-align: center;
float:left; width:849px;
}
#fty{
background-color:#1E1E1E;
width:61px;
height:218px;
margin-left:849px;
}
#navi{
background-image:url(Bilder/bg_verweise.gif);
background-repeat:repeat-x;
width:910px;
height:28px;
text-align: center;
}
#main {
overflow: auto;
padding-left: 1ex;
padding-right: 1ex;
width:898px;
background-color:#000;
}
Jetzt hätte ich aber gerne noch links und rechts neben dem bestehenden konstrukt 2 Div Boxen die über die gesamte Länge (sprich vertikal von oben bis unten je nachdem wie lang der Text in der class main ist) gehn.
geht das und wenn ja wie? Ich krieg das absolut nicht hin...
Oder hab ihr für den Aufbau eine bessere Lösung. Tabellen habe ich schon probiert das schaut nicht gut aus.
Freue mich auf eure Antworten und bedanke mich im vorraus.
LG Wulf
-
Sry hab die HTML Datei vergessen anzuhängen. Hier der Code falls benötigt:
<body onload="MM_preloadImages('Bilder/button_newsh.gif','Bilder/button_gallerieh.gif','Bilder/button_kontakteh.gif','Bilder/button_eventsh.gif','Bilder/button_riegerh.gif','Bilder/button_shoph.gif','Bilder/button_impressumh.gif')"> <div id="impressum" class="rand_around"><a href="impressum.html" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('button_impressum','','Bilder/button_impressumh.gif',1)"><img src="Bilder/button_impressum.gif" name="button_impressum" width="72" height="28" border="0" id="button_impressum" align="right" /></a></div> <div id="header" class="rand_left"><h1 style="color:#FFF">Lord Rieger Header</h1></div> <div id="fty" class="rand_both"></div> <div id="navi" class="rand_around"> <a href="news.html" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('button_news','','Bilder/button_newsh.gif',1)"><img src="Bilder/button_news.gif" name="button_news" width="36" height="28" border="0" id="button_news" /></a> <img src="Bilder/strich.gif" /> <a href="gallerie.html" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('button_gallerie','','Bilder/button_gallerieh.gif',1)"><img src="Bilder/button_gallerie.gif" name="button_gallerie" width="66" height="28" border="0" id="button_gallerie" /></a> <img src="Bilder/strich.gif" /> <a href="kontakte.html" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('buton_kontakte','','Bilder/button_kontakteh.gif',1)"><img src="Bilder/button_kontakte.gif" name="buton_kontakte" width="71" height="28" border="0" id="buton_kontakte" /></a> <img src="Bilder/strich.gif" /> <a href="events.html" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('button_events','','Bilder/button_eventsh.gif',1)"><img src="Bilder/button_events.gif" name="button_events" width="54" height="28" border="0" id="button_events" /></a> <img src="Bilder/strich.gif" /> <a href="rieger.html" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('button_rieger','','Bilder/button_riegerh.gif',1)"><img src="Bilder/button_rieger.gif" name="button_rieger" width="91" height="28" border="0" id="button_rieger" /></a> <img src="Bilder/strich.gif" /> <a href="shop.html" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('button_shop','','Bilder/button_shoph.gif',1)"><img src="Bilder/button_shop.gif" name="button_shop" width="36" height="28" border="0" id="button_shop" /></a></div> <div id="main"></div> </body>-
Lieber Wulf,
bitte schmeiß diesen Code komplett in den Eimer! Er ist grauenvollst!!
Du möchtest Deine Inhalte(!) mittels (X)HTML _auszeichnen_. Dazu benutzt Du zunächst einmal Textabsätze (<p>-Elemente) und passende Überschriften (<h1>-Elemente), vielleicht sogar Unterüberschriften (<h2>-Elemente).
<http://de.selfhtml.org/css/layouts/navigationsleisten.htm@title=Für die Navi benutzt Du eine Liste>.
Und alles, was mit MM_ beginnt entfernst Du besser restlos, sonst wirst Du nicht so bald glücklich mit Deiner Seite.
Wenn dann Dein Dokument sinntragend ("semantisch") ist, dann können wir wieder sinnvoll weiterberaten. Bis dahin ist das hier alles eine Anleitung zu Unsinn mit Unsinn zu multiplizieren.
Liebe Grüße,
Felix Riesterer.
--
ie:% br:> fl:| va:) ls:[ fo:) rl:| n4:? de:> ss:| ch:? js:) mo:} zu:)
-
-
Lieber Wulf,
Ich habe eine Seite aufgebaut komplett mit div-Elementen
das klingt nach <div>-Suppe, und das ist meistens gut gemeinter Unsinn. Hättest Du einen Link, wo man sich Dein Dokument einmal anschauen kann?
Jetzt hätte ich aber gerne noch links und rechts neben dem bestehenden konstrukt 2 Div Boxen die über die gesamte Länge (sprich vertikal von oben bis unten je nachdem wie lang der Text in der class main ist) gehn.
Du kennst bereits das Kapitel <http://de.selfhtml.org/css/layouts/@title=CSS-basierte Layouts> und darin das Unterkapitel <http://de.selfhtml.org/css/layouts/mehrspaltige.htm#kopf_fuss@title=Mehrspaltiges Layout mit Kopf- und Fußzeile>?
Liebe Grüße,
Felix Riesterer.
--
ie:% br:> fl:| va:) ls:[ fo:) rl:| n4:? de:> ss:| ch:? js:) mo:} zu:)