gpt4 book ai didi

html - 内部 div 没有推到 100%

转载 作者:行者123 更新时间:2023-11-28 08:40:21 24 4
gpt4 key购买 nike

我正在使用 Zurb Foundation 5。但是我认为这个问题无论如何都与 Foundation 无关。我有一个外部 divheight: auto; 其中一个内部 div 我正在尝试制作 height: 100% 到达页脚。但这是行不通的。目前站点地图 div 和页脚之间存在巨大差距。

可以引用这个链接:http://vani.valse.com.my/schone_lightings/productlisting.html

我的 HTML:

!doctype html>
<html class="no-js" lang="en">

<head>

</head>

<body>
<!--header ends-->

<!--body starts-->
<div class="row">
<div class="small-12 medium-12 large-12 columns"><!-- I want to make this height:100%;-->
<div class="container">
menu 1
</div>

<div class="container">
menu 2
</div>

<div class="container">
content
</div>

<div class="container">
site map
</div>

</div>
</div>
<!--body ends-->

<!--footer starts-->
<div class="small-12 medium-12 large-12 columns footer">
Footer

</div>
<script src="js/vendor/jquery.js"></script>
<script src="js/foundation.min.js"></script>
<script>
$(document).foundation();
</script>
</body>
</html>
<!--footer ends-->

我的 CSS:

body
{
font-family: 'Open Sans', sans-serif;
background-image:url('../img/body-bg.jpg');
}

.row
{
max-width: 85%;
height:100%;

background-color:#fff;
opacity:0.9;
filter:alpha(opacity=90)
}
.container
{
border:1 px solid #000;
width:85%;
margin:0 auto;
background-color:#ff0000;

}

div .container
{
border: 1px solid #000;
padding:10px;
}
.footer
{
background-color:#d2d1cf;
padding:10px;
}

最佳答案

尝试将垂直高度应用于您想要 100% 高度的容器

例如

div {
height: 100vh;
}

关于html - 内部 div 没有推到 100%,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/27834557/

24 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com