0
我想讓我的首頁區域在彼此之下，此刻我有下一個區域，但位於左側。DIV對齊和位置
我希望能夠改變下一個區域的背景顏色。
關於HTML/css的任何提示？
對不起，關於CSS中的長標籤我在做wordpress中的Avada兒童主題。
<div id="main-header">
What can we do for You and Your Company
</div>
<div id="main-index-container">
<div id="index-container">
<div class="services">
<img src="http://localhost:8888/Enviroble/wp-content/uploads/2014/03/Social-Media-Marketing.png" alt="social-media" height="91" width="60"> </img>
<h1>Energy Audits</h1>
<p> Nec nisl pede congue, ipsum nec justo cras bibendum, dui quis. Pretium rutrum elit malesuada sodales, in id et, sodales ut ipsum leo risus.</p>
</div>
</div>
<div id="index-container">
<div class="services">
<img src="http://localhost:8888/Enviroble/wp-content/uploads/2014/03/Social-Media-Marketing.png" alt="social-media" height="91" width="60"> </img>
<h1>Energy Audits</h1>
<p> Nec nisl pede congue, ipsum nec justo cras bibendum, dui quis. Pretium rutrum elit malesuada sodales, in id et, sodales ut ipsum leo risus.</p>
</div>
</div>
<div id="index-container">
<div class="services">
<img src="http://localhost:8888/Enviroble/wp-content/uploads/2014/03/Social-Media-Marketing.png" alt="social-media" height="91" width="60"> </img>
<h1>Energy Audits</h1>
<p> Nec nisl pede congue, ipsum nec justo cras bibendum, dui quis. Pretium rutrum elit malesuada sodales, in id et, sodales ut ipsum leo risus.</p>
</div>
</div>
<div id="index-container">
<div class="services">
<img src="http://localhost:8888/Enviroble/wp-content/uploads/2014/03/Social-Media-Marketing.png" alt="social-media" height="91" width="60"> </img>
<h1>Energy Audits</h1>
<p> Nec nisl pede congue, ipsum nec justo cras bibendum, dui quis. Pretium rutrum elit malesuada sodales, in id et, sodales ut ipsum leo risus.</p>
</div>
</div>
<div id="index-container">
<div class="services">
<img src="http://localhost:8888/Enviroble/wp-content/uploads/2014/03/Social-Media-Marketing.png" alt="social-media" height="91" width="60"> </img>
<h1>Energy Audits</h1>
<p> Nec nisl pede congue, ipsum nec justo cras bibendum, dui quis. Pretium rutrum elit malesuada sodales, in id et, sodales ut ipsum leo risus.</p>
</div>
</div>
<div id="index-container">
<div class="services">
<img src="http://localhost:8888/Enviroble/wp-content/uploads/2014/03/Social-Media-Marketing.png" alt="social-media" height="91" width="60"> </img>
<h1>Energy Audits</h1>
<p> Nec nisl pede congue, ipsum nec justo cras bibendum, dui quis. Pretium rutrum elit malesuada sodales, in id et, sodales ut ipsum leo risus.</p>
</div>
</div>
</div>
<div id="index-container-second">
<div id="wrapper">
<div id ="similar">
<div id="text">
<h1>Learn More</h1>
<h1>About us and our solutions...</h1>
<h4>We offer the product, skills and services, looking for an effective way of undertaking sustainability audits or too implement environmental initiatives.</h4>
<p>Arcu tempor scelerisque mollis, cras sapien, et dolor scelerisque tempor placerat, aliquam velit et sed vitae. Lectus ullamcorper turpis dictum, augue vulputate est ullamcorper turpis est.
Eegestas egestas ligula hendrerit, ante facilisis. Elementum volutpat eget, tellus vel mauris sapien luctus a, at aenean erat non non nulla, lorem amet, ligula justo amet. Nec lectus. Ut sociis pulvinar erat erat in sollicitudin, magna lectus phasellus, orci libero non. Suspendisse facilisis blandit porttitor. Nibh enim, ligula blandit commodo tristique blandit id et.</p>
</div>
</div>
</div>
</div>
CSS
/* Index page title container boxes */
div#main-header p {
color:#ffffff !important;
font-size:26px;
padding-top:85px;
text-align:center;
}
/* Index page container boxes */
div.post-content
div#main-index-container{
margin-left:auto;
margin-right:auto;
width:940px;
height:100%;
padding-left:15px;
padding-right:15px;
position:relative;
z-index:1;
clear:right;
}
div#index-container{
width:350px;
height:250px;
margin-left:25px;
margin-right:25px;
margin-bottom:35px;
background-color: #4f5455;
}
div#index-container div.index-container-image div.index-container-header{
Width: 280px;
height:auto px;
}
div#index-container div.services h1{
color: #ffffff !important;
font-size:16px !important;
padding-top:0px;
text-align:center;
margin-bottom: 0em !important:
line-height:5px !important;
}
div#main-index-container div#index-container div.services h1 {
line-height:5px !important;
}
div#index-container div.services p {
color:#ffffff !important;
font-size: 12px;
text-align:center;
padding-top:-10px;
padding-bottom:0px;
padding-left:18px;
padding-right:18px;
line-height:20px !important;
margin-bottom:0em !important:
}
div.post-content ul#servicesli {
display: block;
float: left;
margin-right: 16px;
padding-bottom: 0px;
width: 218px;
}
div#index-container {
width:250px;
float:left;}
div#index-container div.services p img {
display:block;
margin-left: auto;
margin-right: auto;
padding-top:20px;
padding-bottom:10px
padding-left:15px;
padding-right:15px;
}
/* Index page container 2 about us */
div#index-container-second{
float:left;
height:600px;
width:960px;
clear:left;
margin-right:auto;
margin-left:auto;}
div#index-container-second div#wrapper div#similar {
width:100%;
}
div#index-container-second div#wrapper div#similar div#text {
margin-left:auto;
margin-right:auto;
width:960px;
}