<div class="centerOuterDiv">
<div class="centerInnerDiv">
<aside>
<div class="services-box">
<h3>Immigration</h3>
<p>By Refsnes Data. All Rights Reserved.
All content and graphics on
this web site are the property of the company Refsnes Data.</p>
</div>
</aside>
<aside>
<div class="services-box">
<h3>Personal Injury</h3>
<p>By Refsnes Data. All Rights Reserved.
All content and graphics on
this web site are the property of the company Refsnes Data.</p>
</div>
</aside>
<aside>
<div class="services-box">
<h3>Property</h3>
<p>By Refsnes Data. All Rights Reserved.
All content and graphics on
this web site are the property of the company Refsnes Data.</p>
</div>
</aside>
<aside>
<div class="services-box">
<h3>Marriage</h3>
<p>By Refsnes Data. All Rights Reserved.
All content and graphics on
this web site are the property of the company Refsnes Data.</p>
</div>
</aside>
</div><!--end inner
div-->
</div><!--end outer div-->
</section>
CSS File:
.centerOuterDiv {
max-width:960px;
width:100%;
margin: 0 auto;/*centre the elements*/
}
.centerInnerDiv {
width:100%;
margin: 0 auto;/*centre the elements*/
text-align:center; /*centre the elements*/
}
.centerInnerDiv aside {
display:inline-block;
margin:5px;
padding:2px 5px;
vertical-align:top;/*align the elements' top
horizontally*/
}
.services-box {
padding-left:10px;
text-align:centre;
width:220px;
height:250px;
border:2px solid #666666;
box-shadow:inset 0 0 3px black;
-webkit-box-shadow:0 0 3px black;
-moz-box-shadow:0 0 3px black;
border-radius:5px;
-moz-border-radius:5px;
-webkit-border-radius:5px;
font-size:15px;
transition:background-color 1s;
-webkit-transition: background-color 1s;
-moz-transition: background-color 1s;
}
.
services-box:hover {
background-color:#ff4646;;
}
Thanks For sharing this https://goo.gl/8jnL4n
ReplyDelete