Matthias Apsel: problem Fluid design

Beitrag lesen

Om nah hoo pez nyeetz, Bobby!

<div id="profilleft" style="margin-right:10px;float:left;width:480px">
    <div style="background:rgb(255,255,255);border-radius:7px;">
        <img src="...." style="height:600px;"/>
    </div>
</div>
<div id="profilright" style="margin-right:0px;margin-left:520px;">
    <div id="profilleistungen" style="background:rgb(255,255,255);border-radius:7px;">
        <div style="padding-left:10px;margin:0;float:left;width:60%;">
        </div>
        <div style="padding-left:10px;margin:0;float:left;width:40%;">
        </div>
    </div>
</div>

  
Ich hoffe, das ist nicht der endgültige Code. Vermeide inlinestyles. Stecke alle CSS-Festlegungen in eine eigene Ressource. [wiki:CSS einbinden](http://wiki.selfhtml.org/wiki/CSS/Einbindung)  
  
Für ein Bild mit einem weißen Rand benötigt man ganz sicher nicht 2 umgebende Elemente. Alle Angaben kannst du direkt dem Bild geben.  
  
Auf profilright lässt sich sicher ebenso verzichten.  
  

> Wie kann ich das inner float aufheben ohne das äußere Float zu beeinflußen?  
  
Wenn du auf die umgebenden Wrapper-Elemente verzichtest, stellt sich das Problem nicht. Sollte dies nicht möglich sein, bietet sich (mit unterschiedlichem Browser-Support) als Ersatz für float an:  
  
flex-box, display: inline-block, display: table-cell.  
  
So wie ich das sehe, setzt du float nur ein um Elemente nebeneinander zu positionieren. Das ist nicht der Zweck von float. Dafür wurde es jahrelang missbraucht.  
  
Matthias

-- 
Der Unterschied zwischen Java und JavaScript ist größer als der zwischen [Messer und Messergebnis](http://selfhtml.apsel-mv.de/java-javascript/index.php?buchstabe=M#messer).  
![](http://www.billiger-im-urlaub.de/kreis_sw.gif)