Div не центровки внутри Div

Question

.wrapper { 
 
    width: 100%; 
 
    height: 150px; 
 
} 
 

 
.iconBar div { 
 
    float: left; 
 
    font-size: 18px; 
 
} 
 

 
div.iconBar { 
 
    display: table; 
 
    margin: 0 auto; 
 
} 
 

 
.iconBar img { 
 
    height: 35px; 
 
    width: 35px; 
 
    vertical-align: middle; 
 
}

<div class="wrapper"> 
 

 
    <div class="iconBar"> 
 
    <div> 
 
     <img src="http://eventtoursolutions.com/wp-content/uploads/2017/02/convenient.png"> Convinient, All-Inclusive Weekly Price 
 
    </div> 
 
    <div> 
 
     <img src="http://eventtoursolutions.com/wp-content/uploads/2017/02/Insurance.png"> Insurance 
 
    </div> 
 
    <div> 
 
     <img src="http://eventtoursolutions.com/wp-content/uploads/2017/02/mileage.png"> Milage Allowance & Expenses 
 
    </div> 
 
    <div> 
 
     <img src="http://eventtoursolutions.com/wp-content/uploads/2017/02/tractorTrailer.png"> Tractor & Expandable Trailer 
 
    </div> 
 
    <div> 
 
     <img src="http://eventtoursolutions.com/wp-content/uploads/2017/02/professionalDriver.png"> Professional Driver 
 
    </div> 
 

 
    </div> 
 
</div>

Почему мой DIV не центрирования? У меня возникают проблемы с созданием центра Div. Я попробовал кучу решений от других людей, и я получил его для работы в одном из тестов, но этот не работает?

Редактировать: iconBar Div, я хочу, чтобы текст и значки были центрированы. Он должен выглядеть нижней картинке

Answer 1

Идущий по изображению удалить float:left и добавить display: inline-block; к .iconBar div {...} и добавить text-align: center; к div.iconBar {...}

.wrapper { 
 
    width: 100%; 
 
    height: 150px; 
 
} 
 

 
.iconBar div { 
 
    display: inline-block; 
 
    font-size: 18px; 
 
} 
 

 
div.iconBar { 
 
    display: table; 
 
    text-align: center; 
 
    margin: 0 auto; 
 
} 
 

 
.iconBar img { 
 
    height: 35px; 
 
    width: 35px; 
 
    vertical-align: middle; 
 
}

<div class="wrapper"> 
 

 
    <div class="iconBar"> 
 
    <div> 
 
     <img src="http://eventtoursolutions.com/wp-content/uploads/2017/02/convenient.png"> Convinient, All-Inclusive Weekly Price 
 
    </div> 
 
    <div> 
 
     <img src="http://eventtoursolutions.com/wp-content/uploads/2017/02/Insurance.png"> Insurance 
 
    </div> 
 
    <div> 
 
     <img src="http://eventtoursolutions.com/wp-content/uploads/2017/02/mileage.png"> Milage Allowance & Expenses 
 
    </div> 
 
    <div> 
 
     <img src="http://eventtoursolutions.com/wp-content/uploads/2017/02/tractorTrailer.png"> Tractor & Expandable Trailer 
 
    </div> 
 
    <div> 
 
     <img src="http://eventtoursolutions.com/wp-content/uploads/2017/02/professionalDriver.png"> Professional Driver 
 
    </div> 
 

 
    </div> 
 
</div>