如何设置DIV宽动态基于高度

-1

<div class="persoonal"> 
    <div class="left"></div> 
    <div class="rigth"></div> 
</div>

我的CSS代码

.profile { 
width: 100%;} 

.left { 
width: 50%; 
float: left; 
height: auto; 
display: inline-block;} 

.rigth { 
float: right; 
width: 48%; 
height: 100px; 
display: inline-block;}

我是新来的HTML，

我想给人留下的div宽度当右侧div的高度为100px时，为50％，，并且当它的高度高于100px时，我想给出相同的左侧div宽度100％。

有什么建议吗？在此先感谢。

来源

2015-01-21 Srikanth

您可以通过jQuery的做到这一点，

var div_width = $(".left").width(); 
var r_div_height = $(".right").height(); 
if(r_div_height == '100') 
    $(".left").width('50'); 
if(div_width == '100') 
    $(".left").width('100');

这样，您就可以做到这一点。

来源

2015-01-21 07:49:02

从我的理解，这可能帮助

if ($('.rigth').height() > 100) { 
 
    $('.left').css("width", "100%"); 
 
}

.profile { 
 
    width: 100%; 
 
} 
 
.left { 
 
    width: 50%; 
 
    background: red; 
 
    float: left; 
 
    height: auto; 
 
    display: inline-block; 
 
} 
 
.rigth { 
 
    float: right; 
 
    background: blue; 
 
    width: 48%; 
 
    height: auto; 
 
    display: inline-block; 
 
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script> 
 
<div class="persoonal"> 
 
    <div class="left">Test</div> 
 
    <div class="rigth">Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor 
 
    in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</div> 
 
</div>

来源

2015-01-21 08:38:56 Prachit

如何设置DIV宽动态基于高度

回答

相关问题