How to align 3 divs side by side horizontally (left center right) inside another div?

Align 3 divs in one line left-center-right side by side in horizontal without having to define explicit sizes that is without using width.
Left should be aligned most to the left edge, right to the right edge and center to the center(middle of left and right div as shown below.

For this (3 divs side by side horizontally (left center right) inside another div) here is the quick and simple css. Hope this will be useful 🙂
HTML

<div class="wrap">
  <div class="left">
      left
  </div>
  <div class="right">
      right
  </div>
  <div class="center">
      center
</div>
</div>

CSS

.wrap{
    text-align:center
}
.left{
    float: left;
    background:grey
}
.right{
    float: right;
    background:red
}
.center{
 
    background:green;
    margin:0 auto;
   display:inline-block
}

I have implemented this “align 3 divs left center right inside another div” on one of my web app “Nepali calendar“. here is screenshot of it.

Subscribe by email below and please follow me on http://www.twitter.com/myashesh.

I Will Sent You An Email Immediately After You Subscribe To Confirm, Make Sure To Click The Link In That Email.