html - Aligning text to center of last div -

i new due css & html design. facing issue in aligning text center of last div.

i have created js fiddle :http://jsfiddle.net/80sems56/

please aligning last div text "stress" center of last image.

code like:

<div>                         <div id="imgweight" class="floatleft">                             <img alt="body weight" class="icon110" src="../../images/ontrack/bmi_icon_100.png"/>                             <div class="textaligncenter">body weight</div>                         </div>                         <div id="imgbloodpressure" class="margin5 floatleft">                             <img alt="blood pressure" class="icon110" src="../../images/ontrack/health_manager_icon_100.png"/>                             <div class="textaligncenter">blood pressure</div>                         </div>                         <div id="imgstress" class="floatleft">                             <img alt="stress" class="icon110" src="../../images/ontrack/stress_icon_100.png"/>                             <div class="textaligncenter">stress</div>                         </div>                     </div> 

css

.

padding20px{     padding:20px; }  .margin20px{     margin:20px; }  .imgsteps{     padding:20px;     position:absolute; }  .bckcolor{     background-color: @secondary;     color:@white; }  .fontfamily {     font-family: "avenir next light"; }  h3{     color:grey; }  .margin5 {     margin-left: 5%;     margin-right: 5%; }  .margin15 {     margin-left: 15%; }  .margin6{     margin-left: 6%; }  .margin10 {     margin-left: 10%; }  .margin50{      margin-left:50%;  }  .absposition{     position: absolute; }  .floatleft{     float:left; }  .shadow {     box-shadow: 0 0 3px 0 rgba(0, 0, 0, 0.4); }  .opacity{     opacity: 0.3;   filter: alpha(opacity=30); }  #dvnavigationarea ul li {     display: inline;     padding-right:20px;     width:100px;     position:relative;  }  .underline{     content:'';     height: 0;         left:0;     bottom:0px;     border-bottom: 4px solid #53adb3;   }   /*for css chart control*/ .container {   width: 100px;   margin: 20px;   background: #fff;   padding: 20px;   float: left; }  .horizontal .progress-bar {   height: 45px;   width: 100%;   padding: 12px 0; }  .horizontal .progress-track {   width: 100%;   height: 20px;   background: #ebebeb; }  .horizontal .progress-fill {   background: #666;   height: 20px;   width: 50%;   color: #fff;   text-align: center;   font-size: 12px;   line-height: 20px; }  .fontcolor{     color:#53adb3; }  .fontsizexlarge{     font-size: x-large; }  .fontsizexxlarge{     font-size: xx-large; }  .fontsize22{     font-size: larger; }  .fontsize10{     font-size: large; }  .icon110 {     background-color:@secondary;     -moz-border-radius:50%;     -webkit-border-radius:50%;     border-radius: 50%;     width:@col-size;height:@col-size; }  .textaligncenter{     text-align:center;     }  .minwidth {  } 

you did typo while assigning class last div. use floatleft instead of floatleft (the letter l culprit)

js fiddle