Hallo Leute ich hab da bei meinem Layout ein kleines Problem, habe an einer position im layout 3 divs.
1 Box div und 2 die darin angelegt sind. Die 2 inneren lassen sich einfach nicht untereinander positionieren.

Code :

1 2 3 4 5 6

<div class="order">      <div class="innerdiv">lorem      </div>      <div class="innerdiv">ipsum      </div> </div>

hier mal der code, hoffe jemand kann helfen:
Notiz: ist nur ein Ausschnitt, wenn ich den restlichen css code der in den divs ist entferne habe ich noch immer das Problem

Code :

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16

div.order{                                                      position:relative;                             z-index: 10;                                     top: 170px;                             bottom: 80px; }   div.innerdiv        {                               margin-bottom: 5px;                                                         padding-top: 1px;                             padding-bottom: 2px;                             padding-left: 5px;                             padding-right: 5px;                                     display:inline;                             max-width:196px;                         }

Um die position:relative im order div komm ich leider nicht rum. Hoffe jemand hat ne Lösung

LG Tom

Mach es doch einfach so:

HTML-Code:

<div class="order">
     <div class="innerdiv">lorem
     </div>
  <br>
     <div class="innerdiv">ipsum
     </div>
</div>

hi danke dir für die rasche antwort hatte das jetzt so mit dem <br> gemacht und das hat mich beim betrachten des ergebnisses auf eine andre Idee gebracht:

hab um die jeweiligen innerdiv objekte noch ein div gesetzt das mir den margin zum nächsten angibt.

somit setzt er diese untereinander und die inneren bleiben mit display:inline von der größe her begrenzt

Danke nochmals :=)

LG Tom

Einfach display: inline; weg. Du willst das ja nicht inline haben Und mit br macht man sowas nicht Habe die Blöcke zusätzlich rot markiert, damit man es besser sieht

HTML-Code:

div.order{                          
                            position:relative;
                            z-index: 10;        
                            top: 170px;
                            bottom: 80px;
}
 
div.innerdiv        {   
                            margin-bottom: 5px;
                            padding-top: 1px;
                            padding-bottom: 2px;
                            padding-left: 5px;
                            padding-right: 5px;         
                            background-color:red;
                            max-width:196px;
                        }