CSS - 最大幅までの浮動小数点

Question

半弾性のコンテナに1列のアイテムを作成しています。左にプロフィール画像があり、コンテンツが右に浮かんでいます（両方とも左に浮いています）。

私がしようとしているのは、コンテンツの浮動小数点を浮動小数点の可能な最大幅ではなく最大可能幅にすることです。

CSS：

#container { 
    max-width: 800px; 
    min-width: 500px; 
} 
.profile { 
    float: left; 
    width: 100px; 
} 
.info { 
    float: left: 
    min-width: 400px; 
    max-width: 700px; 
} 

HTML：あなたはそれが親を埋めるために展開したいとき

<div id="container"> 
    <div class="profile"> 
     IMG 
    </div> 
    <div class="info"> 
     INFO 
    </div> 
</div> 

Answer 1

それが何かをfloatにあまり意味がありません。 float: leftと幅プロパティを.infoディビジョンから削除して、親の幅を塗りつぶすように展開し、次にmargin-left: 100pxを追加して、まだ左に浮かべているものの下から押し出します。

Answer 2

親要素に与える要素をフローティングにする場合は、clear：both、overflow：hidden;を使用します。

#container { 
width: 800px; 
clear: both; 
overflow: hidden; 
} 

.profile { 
    float: left; 
    width: 100px; 
} 
.info { 
    float: left: 
    min-width: 400px; 
    max-width: 700px; 
}