✔ 2 Divs nebeneinander

[GFX-Händchen]

Ich hab schon Kopfschmerzen!

Möchte 2 Divs nebeneinander haben und darin jeweils noch weitere Divs doch ich bekomms nicht hin.
Hab im Code schon wieder so viel geändert, dass ich kein Plan mehr hab.

Also wie gesagt 2 Divs nebeneinander und darin dann im linken 3 weitere Divs (untereinander) und im rechten 2 weitere Divs

So sieht mein (verpfuschter) Code jetzt aus:

HTML:

<div id="5_bereiche_mitte">
   <div id="3_bereiche_links">
         <div id="pic12"></div>
         <div id="pic14"></div>
         <div id="pic15"></div>
      </div>
    <div id="2_bereiche_rechts">
         <div id="pic13"></div>
         <div id="pic16"></div>
    </div>
        <div class="clear"></div>
        </div>

CSS:

#5_bereiche_mitte {
	height: 522px;
	width: 0px;
	float: none;
	clear: none;
}

#3_bereiche_links {
	float: left;
	height: 522px;
	width: 335px;
}
#2_bereiche_rechts {
	float: right;
	height: 502px;
	width: 625px;
	position: none;
	left: 346px;
	top: 355px;
	clear: none;
}

.clear {
	clear: left;
}

Da ich kein Durchblick mehr habe:suspekt:, habe ich jetzt aus dem Code vorerst mal nichts gelöscht!

 

[Maik]

Moin,

ein ID-Bezeichner darf nicht mit einer Ziffer beginnen (gilt auch für Klassenbezeichner).

<div id="bereiche_mitte_5">
   <div id="bereiche_links_3">
         <div id="pic12">pic12</div>
         <div id="pic14">pic14</div>
         <div id="pic15">pic15</div>
   </div>
    <div id="bereiche_rechts_2">
         <div id="pic13">pic13</div>
         <div id="pic16">pic16</div>
    </div>
    <div class="clear"></div>
</div>

#bereiche_mitte_5 {
        height: 522px;
}
#bereiche_links_3 {
        float: left;
        height: 522px;
        width: 335px;
}
#bereiche_rechts_2 {
        float: right;
        height: 502px;
        width: 625px;
}
.clear {
        clear: left;
}

mfg Maik

P.S. Eine Positionsart namens position:none gibt es überhaupt nicht.

 

[GFX-Händchen]

Danke

Man, sowas einfaches und ich kam garnicht drauf.

P.S. Eine Positionsart namens position:none gibt es überhaupt nicht.

Das ist mir klar , aber in dem Programm wo ich das mache kann ich - nachdem ich die position nicht mehr brauche - den Code nicht einfach löschen sondern nur auf none setzen (ist dann ja auch deaktiviert, als hätte ich position garnicht benutzt).
Man muss dann höchstens zum Schlss nochmal manuell Hand am Code anlegen um die Dinge zu löschen die nur Balast sind.

 

[Maik]

Das ist mir klar , aber in dem Programm wo ich das mache kann ich - nachdem ich die position nicht mehr brauche - den Code nicht einfach löschen sondern nur auf none setzen (ist dann ja auch deaktiviert, als hätte ich position garnicht benutzt).
Man muss dann höchstens zum Schlss nochmal manuell Hand am Code anlegen um die Dinge zu löschen die nur Balast sind.

Dann dürfte es sich wohl wieder um dieses ausgezeichnet anwenderfreundliche Programm handeln, das sich nicht bändigen lässt, und das dir noch immer zeigt, wer hier der Herr im Hause ist :suspekt:

Verrätst du mal seinen Namen?

mfg Maik

 

[GFX-Händchen]

Nöö, diesmal ist es das nicht.
Diesmal ist es was professionelleres - und nichts kostenloses - nämlich Dreamweaver.

Hmm, jetzt hab ich aber noch ein kleines Problem:
Bekomme jetzt keinen Footer mehr unter die 2 Divs - man sieht im FF sowie im IE nichts, auch DW zeigt kein Bild (im Div) an.:suspekt:
Vor allem zeigt DW auch die 2 Divs - die "wir" (du und ich) oben bearbeitet haben - nebeneinander nicht so an, aber im FF und IE passt alles.

 

[Maik]

Hmm, jetzt hab ich aber noch ein kleines Problem:
Bekomme jetzt keinen Footer mehr unter die 2 Divs

Ich schon

<div id="bereiche_mitte_5">
   <div id="bereiche_links_3">
         <div id="pic12">pic12</div>
         <div id="pic14">pic14</div>
         <div id="pic15">pic15</div>
   </div>
    <div id="bereiche_rechts_2">
         <div id="pic13">pic13</div>
         <div id="pic16">pic16</div>
    </div>
    <div id="footer" class="clear">footer</div>
</div>

#bereiche_mitte_5 {
        min-height: 522px; /* Mindesthöhe */
}

Vor allem zeigt DW auch die 2 Divs - die "wir" (du und ich) oben bearbeitet haben - nebeneinander nicht so an, aber im FF und IE passt alles.

Gut möglich, dass hier das Modell zusammenbricht, weil der horizontale Viewport in "DW" zu schmal ist, denn in den Webbrowsern bricht in diesem Fall die rechte Spalte ebenfalls um.

Lösung: Eine Mindestbreite einrichten.

#bereiche_mitte_5 {
        min-height: 522px;
        min-width:  960px; /* Mindestbreite */
}

... sowie http://www.brunildo.org/test/min-widthS.html für den IE<7, der min-width nicht unterstützt.

mfg Maik

 

[GFX-Händchen]

Danke, bekomms trotzdem im Moment nicht hin.
Hab zuviel Kopfschmerzen und gönn mir erstmal ne Pause.
Probiers also später weiter.

 

[Maik]

Denn mal gute Besserung

Bei Kopfschmerzen hilft mir immer ein ausgiebiger Spaziergang im Grünen. Zudem löst er bei mir die Gripsmuskelverhärtungen, wenn ich mich mal für einen Moment von der Arbeit abwende

mfg Maik

 

[GFX-Händchen]

Danke, nach der Auszeit hat alles wunderbar funktioniert!