how to align div next to each other inside li with width as percentage

http://stackoverflow.com/questions/39717459/how-to-align-div-next-to-each-other-inside-li-with-width-as-percentage

by aravindfz

HTML

<div id="btmIconsDiv">
  <ul>
    <li>
      <div class="btmIconsUlliDiv"></div>                    
    </li>
    <li>
      <div class="btmIconsUlliDiv"></div>                    
    </li>
    </ul> 
</div>

CSS

#btmIconsDiv{
    float: left;
    margin-top: 84px;
    width: 100%;
    height: 341px;
    background-color: orange;    
    position: relative;
    display:table;
}

#btmIconsDiv ul li{  
     width: 55%;
    display:inline;
    margin-left:40px;
   /* padding-right: 30px;       */
}

#btmIconsDiv ul li div.btmIconsUlliDiv{    
    display:table-cell;
    width: 274px;
    /*margin-right: 50px;*/
    height: 300px;
    background-color: red;
    border: 1px solid blue;
}