我有一个内容包装器,我设置高度100%,但问题是背景颜色没有完全扩展到所有内容。我附上了图片和我的代码,任何帮助都会非常感谢!包装器后面的明显空白区域:http://imgur.com/8h18AdH
HTML(不起作用的部分是div outerColor
):
<p id="dimensions"></p>
<div id="windpageTitle">
<div class="headerContent">
<nav>
<ul class="navDown">
<li><a href="../index.html">Home</a></li>
<li><a href="#windSubtitleSavings">Save</a></li>
<li><a href="#windSubtitleLocation">Locations</a></li>
<li><a href="#windSubtitleStart">Activate</a></li>
</ul>
<a href="#" class="subMenuIcon"><p class="menu"></p></a>
</nav>
<h1 class="pageTitleText">Wind.</h1>
<div class="pageNav">
<ul class="navLink">
<li><a href="../index.html">Home</a></li>
<li><a href="#savingsSub">Savings</a></li>
<li><a href="#locationSub">Location</a></li>
<li><a href="#SubtitleStart">Start</a></li>
</ul>
</div>
</div>
</div>
<div id="outerColor">
<div class="innerContent">
<div id="savingsSub">
<p class="graph"><img src="../images/graph.png" width="500px" height="500px" /></p>
<p class="savingsText">Text here</p>
</div>
<div id="locationSub">
<p class="map"><img src="../images/mapWind.png" width="500px" height="257px" /></p>
<p class="locationText">TEXT HERE</p>
</div>
</div>
</div>
CSS:
#windpageTitle {
background-color: #fff;
width:100%;
height:170px;
}
#outerColor {
background-color:#666;
width:100%;
height:100%;
}
.innerContent {
position:relative;
width:90%;
margin:auto;
text-align:center;
}
#savingsSub {
position:relative;
display:table;
padding-top:40px;
width:1300px;
float: left;
}
.savingsText {
display: table-cell;
vertical-align: middle;
float:right;
padding-right:30px;
padding-top:125px;
width:700px;
font-family: 'Oxygen', sans-serif;
font-size:18px;
color:#fff;
line-height:25px;
}
#locationSub {
position:relative;
display:table;
padding-top:55px;
width:1600px;
float: right;
}
.locationText {
display: table-cell;
vertical-align: middle;
float:left;
width:700px;
padding-left:350px;
padding-top:55px;
font-family: 'Oxygen', sans-serif;
font-size:18px;
color:#fff;
line-height:25px;
}
.graph {
float:left;
width:500px;
height:500px;
}
.map {
float:right;
}
答案 0 :(得分:-1)
请添加位于元素和所有CSS中的所有HTML。现在无法解决!