VirtualMV/CSS/Layout/Block centering/Content
From WikiEducator
< VirtualMV | CSS | Layout | Block centering
Introduction
Aligning the blocks on your page is a technique that allows for a balanced web page.
Cascading Style SheetsBy the end of this page you will be able to:
|
Examples
<div style="width: 50%; margin-right:auto; margin-left:auto; text-align: center"> Basic </div>
<div style="width: 96%; margin-right:auto; margin-left:auto; font-family: menu,Arial; border: 1px solid #808080; background-color: #F6F9ED;"> Text in here </div>
<div style="width: 200px; margin-right:auto; margin-left:auto; font-family: menu,Arial; border: 1px solid #808080; background-color: #F6F9ED; -webkit-box-shadow: 5px 5px 7px #999;"> 200px wide </div>
<div style="width: 96%; margin-right:auto; margin-left:auto; text-align: center; font-family: menu,Arial; border: 1px solid #808080; background-color: #F6F9ED;"> Text in here <div style="width: 200px; margin-right:auto; margin-left:auto; border: 1px solid #808080;"> Centered in a container </div>