Seite 1 von 1

div-Container

Verfasst: 14.11.2008 00:10
von Ogniquok
hey leute!
hab mal ne frage zu folgenden div-containern:

Code: Alles auswählen

<div id="1" style="border-style: solid; border-width: 3px; width: 300px; height: 500px; margin: 10px;">
	<div id="2" style="border-style: solid; border-width: 3px; width: 100px; height: 50px; margin: 10px;"></div>
	<div id="3" style="border-style: solid; border-width: 3px; width: 100px; height: 50px; margin: 10px;"></div>
</div>
wie schaff ich es, dass der 3. container neben dem 2. container im 1. container angezeigt wird, und nicht unter ihm?

Verfasst: 14.11.2008 01:20
von piero
mit dem attribut "float" und wert "left"
das bedeutet, dass das alles was nach diesem elemnt kommt, rehts um das element "fliesst"

Code: Alles auswählen

<div id="1" style="border-style: solid; border-width: 3px; width: 300px; height: 500px; margin: 10px;">
   <div id="2" style="border-style: solid; border-width: 3px; width: 100px; height: 50px; margin: 10px; float: left;"></div>
   <div id="3" style="border-style: solid; border-width: 3px; width: 100px; height: 50px; margin: 10px;"></div>
</div>

Verfasst: 14.11.2008 03:44
von gn#36
Alternativ wenn du sowieso schon feste Breiten hast kannst du auch eine Feste Position angeben (position: fixed; left: x px; top: x px;)

Verfasst: 23.11.2008 20:27
von luigee
die beste Lösung ist mit float:left....ein anschließendes DIV mit clear:both um die Anordnung wieder aufzuheben sollte auch nicht vergessen werden.

Code: Alles auswählen

<div id="1" style="border-style: solid; border-width: 3px; width: 300px; height: 500px; margin: 10px;">
   <div id="2" style="border-style: solid; border-width: 3px; width: 100px; height: 50px; margin: 10px; float: left;"></div>
   <div id="3" style="border-style: solid; border-width: 3px; width: 100px; height: 50px; margin: 10px; float: left"></div>
   <div style="clear:both"></div>
</div>