float

float

CSS float Property

The CSS float property is used to float elements to a specific side. You can strategically float block elements and specify widths, heights, and margins for them.

CSS CODE EXAMPLE

<style type="text/css">
.columnLayout {
    float: left;
    background: #BFFFFF;
    border: #00D2D2 1px solid;
    padding: 12px;
    width: 120px;
    height: 240px;
    margin: 5px;
}
</style>
<div class="columnLayout">div content ...</div>
<div class="columnLayout">div content ...</div>
<div class="columnLayout">div content ...</div>

 

div content ...

div content ...

div content ...

CSS CODE EXAMPLE

<style type="text/css">
#div1 {
    float: left;
    background: #BFFFFF;
    border: #00D2D2 1px solid;
    padding: 12px;
    width: 120px;
    height: 60px;
}
#div2 {
    float: right;
    background: #FFD9F8;
    border: #F0F 1px solid;
    padding: 12px;
    width: 120px;
    height: 60px;
}
</style>
<div id="div1">div content ...</div>
<div id="div2">div content ...</div>

 

div content ...

div content ...

Possible Values:

left •• right •• none

Related Material:

CSS clear Property

click here to code. 

Tweet