How to disable automatic horizontal to vertical conversion in Bootstrep 3 - html

Question

I am using this code in a page in bootstrap 3.
<div class="description_text">
<div class="row">
<!-- Sunny -->
<div class="col-md-2">
<div class="horizontal_center">
<img src="img/sunnylogo.png" alt="Sunny logo">
</div>
<div class="horizontal_center">
Sunny
</div>
</div>
<!-- End Sunny -->
<!-- Walking -->
<div class="col-md-2">
<div class="horizontal_center">
<img src="img/walkinglogo.png" alt="Walking logo">
</div>
<div class="horizontal_center">
Walking
</div>
</div>
<!-- End Walking -->
<!-- Windy -->
<div class="col-md-2">
<div class="horizontal_center">
<img src="img/windylogo.png" alt="Windy logo">
</div>
<div class="horizontal_center">
Windy
</div>
</div>
<!-- End Windy -->
<!-- Rain -->
<div class="col-md-2">
<div class="horizontal_center">
<img src="img/rainlogo.png" alt="Rain logo">
</div>
<div class="horizontal_center">
Rain
</div>
</div>
<!-- End Rain -->
<!-- Snow -->
<div class="col-md-2">
<div class="horizontal_center">
<img src="img/snowlogo.png" alt="Snow logo">
</div>
<div class="horizontal_center">
Snow
</div>
</div>
<!-- Snow -->
</div>
</div>
When window is full screen, it is OK.
But if I make it small, it making problem.
It goes to vertically.
I want to stop this property of bootstrap in this page.
Can anyone please help me?
Thanks in advance for helping.

Answer 1

You can use more then one class according to resolution
col-md-2 Medium devices Desktops (≥992px)
col-sm-2 Small devices Tablets (≥768px)
col-xs-2 Extra small devices Phones (<768px)
Use
<div class="col-md-2 col-sm-2 col-xs-2"></div>

Answer 2

Simply don't use bootstrap's col-md-x and row classes. Make your own divs and style them by yourself.
Or you could style the col-md-2 class like so:
.col-md-2{
float: left;
}