Не удается получить всю ширину родительского контейнера

Я пытаюсь отобразить таблицу по всей ширине контейнера, на самом деле я использую класс col-sm-2 и hideable-sidebar загрузочного лотка. Это мой HTML структура:Не удается получить всю ширину родительского контейнера

<div class="col-sm-2 hideable-sidebar" id="resource_container"> 

      <h4>Resource</h4> 

      <div class="input-group"> 
       <input type="text" placeholder="search" class="form-control" > 
       <span class="input-group-btn"> 
        <button class="clear btn btn-default" type="button"> 
         <span class="glyphicon glyphicon-remove"></span> 
        </button> 
        </span> 
      </div> 

      <table style="margin-top: 10px; height: 396px;" border='1'> 
      <tr id="res-1"><td style="background-color:#FF000C" class="resource-color">&nbsp;&nbsp;</td><td style="padding-left: 10px"><div><strong>foo</strong><br>test</div></td></tr> 
      <tr id="res-1"><td style="background-color:#F41FF2" class="resource-color">&nbsp;&nbsp;</td><td style="padding-left: 10px"><div><strong>foo</strong><br>test</div></td></tr> 
      <tr id="res-1"><td style="background-color:#FFCCC2" class="resource-color">&nbsp;&nbsp;</td><td style="padding-left: 10px"><div><strong>foo</strong><br>test</div></td></tr> 
      </table> 

     </div>

And here the JSFIDDLE

Это образ конечного результата, что мне нужно взять с собой:

источник

2017-01-03 AgainMe

Почему вы не просто настроить CSS для ваших нужд? – connexo

Хорошо, тогда сделайте это? Что мешает вам? – connexo

Просто добавьте width: 100%; к вашей таблице, как я сделал здесь: https://jsfiddle.net/DTcHh/28309/

Надеюсь, это то, что вы ищете ING для :)

источник

2017-01-03 11:40:47

так просто, никогда не думал об этом. спасибо и счастливого нового года – AgainMe

приветствую вас и счастливого нового года;) пожалуйста, отметьте мой ответ в качестве правильного ответа, если он решит вашу проблему :) –

уверен, что только время ожидания stackoverflow – AgainMe

Вот полный код ..

Просто copyand мимо ..

<div class="col-sm-2 hideable-sidebar" id="resource_container"> 

       <h4>Resource</h4> 

       <div class="input-group"> 
        <input type="text" placeholder="search" class="form-control" > 
        <span class="input-group-btn"> 
         <button class="clear btn btn-default" type="button"> 
          <span class="glyphicon glyphicon-remove"></span> 
         </button> 
         </span> 
       </div> 

       <table border='1' style="margin-top: 10px; height: 396px; width: 100%;"> 
       <tr id="res-1"><td style="background-color:#FFCCC2" class="resource-color">&nbsp;&nbsp;</td><td style="padding-left: 10px"><div><strong>foo</strong><br>test</div></td></tr> 
       <tr id="res-1"><td style="background-color:#F41FF2" class="resource-color">&nbsp;&nbsp;</td><td style="padding-left: 10px"><div><strong>foo</strong><br>test</div></td></tr> 
       <tr id="res-1"><td style="background-color:#F4CCC2" class="resource-color">&nbsp;&nbsp;</td><td style="padding-left: 10px"><div><strong>foo</strong><br>test</div></td></tr> 
       </table> 

      </div>

источник

2017-01-03 11:42:39

Не удается получить всю ширину родительского контейнера

ответ

Смежные вопросы