有沒有辦法做2個div有相同的高度？

我的CSS有沒有辦法做2個div有相同的高度？

body, html { 
    margin: 0; 
    padding: 0; 
    height: 100%; 
    width:100%; 
} 

.wrapper{ 
    width:80%; 
    height:100%; 
    min-height:auto 
    left:0; 
    right:0; 
    margin-left:auto; 
    margin-right:auto; 
    background:red; 
} 

.wrapped-nav{ 
    width:30%; 
    float:left; 
    background:green; 
    height:auto; 
    min-height:100%; 
} 

.wrapped-ent{ 
    width:70%; 
    float:left; 
    background:blue; 
    height:auto; 
    min-height:100%; 
}

我的HTML

<body> 
    <div class="wrapper"> 
     <div class="wrapped-nav">Nav 
     </div> 
     <div class="wrapped-ent"></br></br></br></br></br></br></br></br></br></br></br></br></br></br></br></br></br></br></br></br></br></br></br></br></br></br></br></br></br></br></br></br></br></br>Example</div> 
    </div> 
</body>

jsbin：http://jsbin.com/cefegifula/edit?html,css,output

當我擴大了耳鼻喉科DIV與這克服了DIV導航，空間被創建爲在jsbin顯示，有沒有辦法做2個div有相同的高度？

來源

2015-11-12 Carlos Vazquez

不清楚你在問什麼。你的DIV都是100％的身高。 –

這可能是關於CSS設計的最常見問題之一：「如何讓兩個（或更多）浮動列具有相同的高度？」。毫不奇怪，有很多不同的方法來實現這一點：https://css-tricks.com/fluid-width-equal-height-columns/ – HaukurHaf

我不認爲OP是在問這個問題。他的DIV（藍/綠）都是100％。我認爲他需要相同的* br-spaces-height-someting *。 –

創建一個具有高度並重構代碼的類，以便兩個div都擁有它。

所以，而不是使用100％的兩個div使用vh，px，或em你的優勢。

我會寫它，讓你有這樣的事情。

<div class="class1 heightfix"> 

</div> 
<div class="class2 heightfix"> 
</div>

，然後在你的CSS編寫

.heightfix{ 
    height: 70vh; // or px or whatever. 
}

在其他新聞從未嘗試使用<br/>爲了解決您的間距問題。

來源

2015-11-12 23:08:32

有沒有辦法做2個div有相同的高度？

回答

相關問題