phpBB.de

Verfasst: **26.05.2009 16:28**

Hallo Zusammen

Ich möchte mit CSS ein Design machen, nun habe ich aber ein Problem. Ich möchte zwei <div> Boxen nebeneinander stellen, doch irgendwie ist das nicht möglich. Die <div> Boxen erscheinen immer Untereinander.

Zur veranschaulichung habe ich hier noch ein Bild:
http://raphibolliger.ch/upload/css_design.png
Grössere Bilder bitte nur Verlinken. Siehe dazu im KB:knigge den Absatz zu Avataren und Bildern. OXPUS

Nun soll der Teil mit dem Inhalt "Startseite" rechts neben die Navigaiton...
float: left; habe ich bereits probiert, dies geht nicht weill dann die Box nicht mehr in der vordefinierten div class="all" drin ist und die grösse Frei verändert nicht mit den anderen Boxen zusammen.

Hier noch de Quellcode:

Code: Alles auswählen

		
div.all {
        border: 1px solid #4F81BD;
		width: 990px;
		margin: 0 auto;
		}
div.header{
		border: 1px solid #4F81BD;
		margin: 2px;
		height: 100px;
		background-image: url(images/header.png);
		} 
div.menu{
		border: 1px solid #4F81BD;
		width: 200px;
		margin-left: 2px;
		margin-bottom: 2px;
		}
div.inhalt{
		border: 1px solid #4F81BD;
		margin-left: 2px;
		margin-right: 2px;
		margin-bottom: 2px;
		padding: 8px;
		}
div.footer {
        border: 1px solid #4F81BD;
		margin-left: 2px;
		margin-bottom: 2px;
		margin-right: 2px;
	    font-family: Verdana;
	    font-size: 10px;
	    text-align: center;
	    color: #4F81BD;
	    padding: 2px;
	    background-color: #F6F6F6;
        }
h1{
		font-family: Trebuchet MS;
		color: #17365D;
		font-size: 22px;
		border-bottom-width: 1px;
		border-bottom-color: #17365D;
		border-bottom-style: solid;
		}
p{
		font-family: Verdana;
		color: gray;
		font-size: 14px;
		}
a:link  {
       text-decoration: none;
        }
a:visited {
    text-decoration: none;
        }
div.menu1 {
		padding: 8px;
		padding-left: 20px;
		font-family: Verdana;
		font-size: 14px;
		color: #17365D;
		text-decoration: none;
		}
		
/* Definition des Hauptmenü auf Ebene 1 */		
div.menu1:hover {
        background: #4F81BD;
        background-image: url(images/menu1.png);
        padding: 8px
        padding-left: 20px;
        font-family: Verdana;
		font-size: 14px;
		color: white;
		text-decoration: none;
        }
        
/* Definition des Submenü 1 auf Ebene 2 */        
div.menu2 {
		padding-left: 27px;
		padding-top: 5px;
		padding-bottom: 5px;
		font-family: Verdana;
		font-size: 11px;
		color: #17365D;
		text-decoration: none;
		}
div.menu2:hover {
        padding-left: 27px;
        padding-top: 5px;
		padding-bottom: 5px;
		background: #B6C9E0;
		font-family: Verdana;
		font-size: 11px;
		color: #17365D;
		text-decoration: none;
        }

Danke fürs Helfen..
mfg bairan

Verfasst: **26.05.2009 16:37**

guck dir das beispiel hier an, da funktioniert es

http://www.phpbb.de/support/pastebin.php?mode=view&s=28

Verfasst: **26.05.2009 16:56**

Achte dich mal darauf wenn du die Page so veränderst das die Navigaiton mehr Inhalt nach unten hat als das Inhalts <div> dann stimmt wieder überhaupt nichts und dass ist genau mein Problem, ich habe teilweise mehr Inhalt nach unten in der Navigation und dadurch wird sie über den Footer gelegt!

Verfasst: **26.05.2009 19:43**

dann darfst du nicht "mehr inhalt haben",
weil <div> vom naturell her so reagiert.
oder wähle eine andere lösung..

.. zb. das beide div-container immer gleich lang sind

dürfte wohl eine leichte übung sein.

Verfasst: **29.05.2009 17:14**

SelfHTML: Mehrspaltiges Layout mit Kopf- und Fußzeile (Anzeigebeispiel)

phpBB.de

CSS Problem

CSS Problem

Re: CSS Problem

Re: CSS Problem

Re: CSS Problem

Re: CSS Problem