CSS float align - Set div position left, right or center

CSS float property set the elements align to a left side or right side.

CSS Text formatting chapter already seen CSS text-align property that set text align left, right or center. Same as float property element or group of element align set either left side or right side.

CSS div float right

Example

<!DOCTYPE html>
<html>
<head>
  <title>CSS float property</title>
</head>
<body>
  <div style="width:250px; float:right; background-color: orange;">
    <p>This paragraph is display right side and CSS font-size 20 pixel set.</p>
  </div>
</body>
</html>

Run it... »

CSS div float left

Example

<!DOCTYPE html>
<html>
<head>
  <title>CSS float property</title>
</head>
<body>
  <div style="width:250px; float: left; background-color: orange;">
    <p>This paragraph is display right side and CSS font-size 20 pixel set.</p>
  </div>
</body>
</html>

Run it... »

CSS div float center

You can set float div center by using margin property. you does not need to use float property but you can use margin property and set left or right margin value auto by this way.

Example

<!DOCTYPE html>
<html>
<head>
  <title>CSS margin property</title>
</head>
<body>
  <div style="width:250px; margin: 0px auto; background-color: orange;">
    <p>This paragraph is display center using margin property.</p>
  </div>
</body>
</html>

Run it... »