html фиксированная ширина и динамическая компоновка

Question

У меня есть следующий код. Возможно ли, чтобы div_2 динамически расширял родительский div без родительского div, имеющего ширину?

<div> 
    <div id="div_1"></div> 
    <div id="div_2"></div> 
    <div id="div_3"></div> 
</div> 

#div_1, #div_2, #div_3{ 
float:left; 
} 
#div_1{ 
width:300px; 
} 
#div_3{ 
width:350px; 
} 

Answer 1

Я не уверен, что понимаю, что вы имеете в виду, но может ли это быть тем, что вы хотите?

#div_1, #div_2, #div_3{ 
float:left; height: 400px; 
} 
#div_1{ 
    width:100px; 
    background: red; 
} 
#div_3{ 
    width:150px; 
    background: blue; 
} 
#parent{ 
    border: 4px solid #000; 
    float:left; 
} 

http://fiddle.jshell.net/ndqkg2hq/

Answer 2

Да. Возможно. Поскольку вы даете детям div некоторый float, поэтому вам нужно предоставить переполнение родительскому div. Это может быть переполнение скрыто. Он должен работать. Если все еще есть проблема с шириной, добавьте auto в ширину родительского div.

.parentdiv{overflow:hidden;width:auto;} 

Answer 3

Да, это возможно, вы можете попробовать ниже CSS для родительского DIV или же вы можете добавить класс .clearfix в родительский DIV

body > div{overflow:hidden;width:auto;} 

ИЛИ

<div class="clearfix"> 
<div id="div_1"></div> 
<div id="div_2"></div> 
<div id="div_3"></div> 
</div> 

CSS для. clearfix class

.clearfix:after { 
visibility: hidden; 
display: block; 
font-size: 0; 
content: " "; 
clear: both; 
height: 0; 
} 
.clearfix { display: inline-block; } 
/* start commented backslash hack \*/ 
* html .clearfix { height: 1%; } 
.clearfix { display: block; } 
/* close commented backslash hack */