Input Element inside floating div

HTML

<div class="r w40 fl">
        <div class="g fl">Aaaaaa:</div>
       
         <div ><input class="b" value="Bbbbbb" /></div>          
    </div>
    <div class="r w30 fl">
        <div class="g fl">Cccccc:</div>
        <div class="b">Dddddd</div>
    </div>
    <div class="r w30 fl">
        <div class="g fl">Eeeeee:</div>
        <div class="b">Ffffff</div>
    </div>

CSS

.r {background-color: pink;}
.g {background-color: rgba(0,100,100,0.5);}
.b {background-color: lightblue;}
.w40 {width: 40%;}
.w30 {width: 30%;}
.w100 {width: 100%;}
.fl {float: left;}
.fr {float: right;}
.cb {clear: both;}


input {
    display:block;
    width :100%; 
    border:none;
    height:18px;
    
}