что-то мешает моей сетке. все должно работать. Я проверил это как отдельную сетку в другом файле html, и это, как и ожидалось.
<div id="bookpanel" class="container-fluid" style="background-color:purple;" >
<div class="row">
<div class="col-md-12 col-12 col-sm-12 mb-4" style="background-color:grey;" >
ttt
</div>
</div>
<div class="row">
<div class="col-md-4 col-sm-4 col-4" id="bookfigure" style="background-color:black;" >
<img src = "/images1/aaa" class="img-responsive" title="" />
</div>
<div class="col-md-8 col-sm-8 col-8 " id="booktags" style="background-color:grey;" >
<div class="row" >
<div class="col-md-10 col-sm-10 col-10" style="background-color:blue;" >
aaaa
</div>
<div class="col-md-2 col-sm-2 col-2" style="background-color:yellow;" >
bbbb
</div>
</div>
<div class="row" >
<div class="col-md-12 col-sm-12 col-12" style="background-color:red;" >
tags:
</div>
</div>
<div class="row" >
<div class="col-md-12 col-sm-12 col-12" id="tagsdiv" style="background-color:green;" >
ccc
</div>
</div>
</div>
</div>
<div class="row">
<div class="col-md-4 col-sm-3 col-4" >
Views:
</div>
<div class="col-md-4 col-sm-3 col-4">
<a href="" ><img src="/images/gifs/Download-Button.gif" style="width:100%;height:50px" /></a>
</div>
<div class="col-md-4 col-sm-3 col-4">
<a href="" ><span id="report">report</span></a>
</div>
</div>
, но это не в больший файл, и он показывает как это изображение: такое же поведение на маленьком экране мобильного телефона.
3 (красный, зеленый, синий) столбца должны быть внутри серого поля