CSS Horizontal Align
CSS
Horizontal Align
Aligning
Block Elements
A block element
is an element that takes up the full width available and has a line break
before and after it. Some example of block elements:
<p> <h1-h6> <div> <hr> <table> <ul> <ol>
Center
Aligning Using the margin Property
Block elements
can be aligned by setting the left and right margins to “auto”.
Example
.center
{
margin-left: 10px;
margin-right: 10px;
height: 100%;
width: 90%;
background-color: #2b6777;
}
Left
and Right Aligning Using the position Property
One method of
aligning elements is use absolute positioning. Absolute positioned are removed
from the normal flow and can overlap elements.
Example
.left{
position: absolute;
height: 100%;
width: 90%;
background-color: #2b6777;
}
Left
and Right Aligning Using the float Property
One method of
aligning elements is use float property.
Example
.left{
float: left;
height: 100%;
width: 300px;
background-color: #2b6777;
}
Leave a comment
No Cmomments yet