phpBB.de

Verfasst: **11.06.2007 21:28**

Hallo,

ich code gerade ein neues Homepage Layout, welches ohne Tabellen, nämlich nur mit Div-Container funktionieren soll.

Nun wollte ich für das 2 - Spalten Layout zwei Divs nebeneinander kriegen. Das habe ich mit inline geschafft.

Nun will ich, dass die erste Spalte 30 % der breite einnimmt und die andere den rest (70 %)

das habe ich alles per CSS so gelöst:

Code: Alles auswählen

.left_box {
width: 30%;
display: inline;
}

.right_box {
width: 70%;
display: inline;
}

Ich habe mal die Farbangaben usw. rausgenommen und nur den wichtigen CSS code gepostet.
Wenn ich die inline Attribute rausnehme funktionieren zwar die Breiteangaben, aber dann sind ja die Container untereinander und nicht mehr nebeneinander.

Aber bei dem jetzigen Code werden die Breitenangaben anscheinend ignoriert.

Vielen Dank im vorraus für die Hilfe
switchon

Verfasst: **11.06.2007 21:45**

Ich würde mal "float: left" und "float: right" probieren.

Siehe : http://www.css4you.de/wslayout1/index.html

Verfasst: **11.06.2007 21:45**

Ich halte hier Display: Inline für keine gute Idee. Versuch mal den beiden jeweils "float" werte zu geben, der linke dann ne höhe von 100% damit das gut klappt. Alternative könnten Frames sein, die sind eben nicht jedermanns Geschmack

Verfasst: **11.06.2007 22:00**

vielen dank, das hat geklappt, jetzt habe ich noch "padding-left:4px;" hinzugefügt und alles hat sich alles verschoben

so sieht der code jetzt aus

Code: Alles auswählen

.left_box {
width: 30%;
display: inline;
float:left;
padding-left:4px;
}

.right_box {
width: 70%;
display: inline;
float:right;
padding-left:4px;
}

Verfasst: **11.06.2007 22:25**

Verschieben ist der Effekt, den Padding nun mal hat

Versuch mal ob margin-left der Effekt ist, den du wolltest

Wenn nicht schreib noch mal wie das aussehen soll.

Verfasst: **11.06.2007 22:41**

ne, das geht leider nicht aus 2 gründen:

1) es verschiebt sich trotzdem alles

2) die container sind mit farbe gefüllt und ich will nicht, den gesamten container 4 pixel nach rechts verschieben, sondern nur den inhalt (die schrift) in dem container, da man mit margin auch den hintergrund (halt den gesamten container) verschiebt

du hast vorhin gesagt, du würdest das nicht mit display:inline lösen

bin ja offen für andere lösungsansätze

wie würdest du es denn lösen?

Verfasst: **12.06.2007 20:01**

keiner ne ahnung?

Verfasst: **13.06.2007 08:26**

Mensch...mach doch noch einen CSS:

Code: Alles auswählen

.content {
padding-left:4px;
}

Und weise es einem neuen DIV Container innerhalb deiner beiden links und rechts boxen zu.

Du hast anscheinend noch nicht meinen o.g. Link verarbeitet...
...ansonsten wärst Du auch hier vorbeigekommen:
http://www.css4you.de/wslayout1/ex0006.html

phpBB.de

CSS: inline und width funktionieren zusammen nicht

CSS: inline und width funktionieren zusammen nicht