CSS Layout How to - float center

Question

We would like to know how to float center.

Answer


<!--  w  w  w .  j a v  a2 s .c  o m-->
<!DOCTYPE html>
<html>
<head>
<title>centerFloat</title>
<style type='text/css'>
#holder {
  margin: 15px;
  padding: 15px;
  background-color: #000;
  color: #fff;
}

#right_text {
  float: right;
  background:yellow;
}

#center_text {
  text-align:center;
  background:red;
}
</style>
</head>
<body>
  <div id="holder">
    <div id="right_text">back to 1-10</div>
    <div id="center_text">this is a test</div>
  </div>
</body>
</html>

The code above is rendered as follows: