|
|||
Ich kriege mein CSS Layout nicht hin :(
Hallo!
Ich bin hier neu! Ich bin momentan dabei einen Einstieg in xhtml + css hinzukriegen Aber leider will mir ein basis layout nicht gelingen ... Ich will das so haben, dass es aussieht wie auf layout.jpg ... sry für die schlechte quali. Angang meine index.html und meine style.css ... Und ich will das vorallem so haben, dass bei veränderung der browsergröße sich die seite anpasst. Leider will das mit dem rechtem Menü nicht gelingen. Und die "div" Fuss kann ich einfach nicht unten possitionieren. Bitte um Ratschlag. |
Sponsored Links |
|
|||
Mal ab davon, dass sicher viele kein RAR installiert haben und somit ein Online- oder hier gepostetes Beispiel effektiver wäre.
Hast Du Dir die Beispiele auf css4you.de mal angeschaut? Davon ausgehend lässt sich schon ein grobes Skellet aufbauen welches auf die Seitengröße angepasst ist. |
Sponsored Links |
|
|||
Tja, ich gehör auch zu denen die kein RAR haben...
|
|
|||
Hmm, so, ich bin da jetzt weiter ... alles klappt bis auf eine kleine Sache
Die Sache ist wie folgt. Ich will jetzt unten eine Fusszeile einrichten. Die soll dynmisch unter dem gelben Teil immer sein! Wie kann ich das einrichten? Sry für die schlechten Farben! Die sind nur für mich da um zu sehen wie die divs angeordnet sind. index.html : Code:
<?xml version="1.0" encoding="iso-8859-15"?> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="de"> <head> <link rel="stylesheet" type="text/css" href="Metabox.css"/> <meta http-equiv="content-type" content="text/html; charset=ISO-8859-15"/> <meta name="Author" content="ConiKost" /> <meta name="description" content="Der Met@box 500 Server - by ConiKost"/> <meta name="keywords" content="ConiKost Metabox"></meta> <title>Der Met@box 500 Server - by ConiKost</title> </head> <body> <div id="Website"> <div id="Kopf"> <h1>Willkommen auf der Met@box 500</h1> </div> <div id="MenuL"> Menü 1</p> Menü 2</p> Menü 3</p> Menü 4</p> Menü 5</p> </div> <div id="Inhalt"> DAS IST DER INHALT!</p> DAS IST DER INHALT!</p> DAS IST DER INHALT!</p> DAS IST DER INHALT!</p> DAS IST DER INHALT!</p> DAS IST DER INHALT!</p> DAS IST DER INHALT!</p> DAS IST DER INHALT!</p> DAS IST DER INHALT!</p> DAS IST DER INHALT!</p> DAS IST DER INHALT!</p> DAS IST DER INHALT!</p> DAS IST DER INHALT!</p> DAS IST DER INHALT!</p> DAS IST DER INHALT!</p> </div> <div id="MenuR"> Menü 6</p> Menü 7</p> Menü 8</p> Menü 9</p> Menü 10</p> </div> <div id="Fuss"> (c) 2006 by ConiKost</p> </div> </div> </body> </html> Code:
/* Met@box 500 Website - CSS Datei */ body { color:white; background-color:black; } #Website { background-color:red; margin:auto; width:80%; } #Kopf { background-color:blue; text-align:center; } #MenuL { background-color:green; float:left; text-align:center; width:10%; } #Inhalt { background-color:yellow; float:left; margin-left:2.5%; margin-right:2.5%; width:75%; } #MenuR { background-color:green; float:right; text-align:center; width:10%; } #Fuss { background-color:orange } |
|
|||
Ein Fall für den heiligen Gral (anderes Wort für ein perfektes 3-Spalten-Layout)! Lies Dir das durch, ist nicht so schwer.
Wichtig ist das clearen wenn Du floatest. Beschreibungen dazu werden hier täglich mehrfach gepostet. Hier ein sehr guter Thread dazu: http://www.xhtmlforum.de/viewtopic.php?t=3772 Dann empfehle ich Dir ein globales Code:
* {margin: 0; padding: 0;} s. Beispiele für schicke Menulisten gibts in meiner Sig. |
|
|||
Zitat:
Lesestoff: http://www.andreas-kalt.de/webdesign.../float-theorie http://www.complexspiral.com/publica...aining-floats/ |
Themen-Optionen | |
Ansicht | |
|
|
Ähnliche Themen | ||||
Thema | Autor | Forum | Antworten | Letzter Beitrag |
CSS Layout Komplex | yanu | CSS | 0 | 01.04.2009 21:27 |
CSS Layout für Fortgeschrittene | StefanE | CSS | 2 | 15.01.2009 08:39 |
3 Spalten Layout in CSS | sisa | CSS | 1 | 22.09.2006 10:28 |
Layout Problem CSS | david.bellem | CSS | 8 | 17.09.2004 12:59 |
css layout oder besser doch tabellen? | chrimp | CSS | 0 | 22.06.2004 16:54 |