それぞれの人の隣にブートストラップパネルを置く方法

Question

私はしばらくの間これを試してきました。私は半初心者です。

これは、私はまだ多くのことを学んでいる

http://prntscr.com/ceex21のように見えるものです。

これは何でも聞く場所だと聞きました

プログラミングとウェブデザイン！

これはコードです：そのような

<div class="col-xlg-4 col-md-6 hidden-xs"> 
     <!-- Example Panel With Footer --> 
     <div class="panel panel-bordered"> 
      <div class="panel-body"> 
      <h4>Body Heading</h4> 
      <p>Wrap buttons or secondary text in <code>.panel-footer</code>. Note 
       that panel footers do not inherit colors and borders when using 
       contextual variations as they are not meant to be in the foreground.</p> 
      </div> 
      <div class="panel-footer">Panel Footer</div> 
     </div> 
     <!-- End Example Panel With Footer --> 
     </div> 
     <!-- End Example Panel With Footer --> 
    </div> 

     <div class="page-content container-fluid"> 
    <div class="row"> 
     <div class="col-xlg-6 col-md-6"> 
     <!-- Example Panel With Heading --> 
     <div class="panel panel-bordered"> 
      <div class="panel-heading"> 
      <h3 class="panel-title">Panel Heading</h3> 
      </div> 
      <div class="panel-body"> 
      <div class="example-wrap"> 
      <h4 class="example-title">Basic</h4> 
      <p>Add class <code>.table</code>.</p> 
      <div class="example table-responsive"> 
       <table class="table"> 
       <thead> 
        <tr> 
        <th>#</th> 
        <th>First Name</th> 
        <th>Last Name</th> 
        <th>Username</th> 
        <th>Role</th> 
        </tr> 
       </thead> 
       <tbody> 
        <tr> 
        <td>1</td> 
        <td>Teagan</td> 
        <td>Prohaska</td> 
        <td>@Elijah</td> 
        <td> 
         <span class="label label-danger">admin</span> 
        </td> 
        </tr> 
        <tr> 
        <td>2</td> 
        <td>Andy</td> 
        <td>Gaylord</td> 
        <td>@Ramiro</td> 
        <td> 
         <span class="label label-info">member</span> 
        </td> 
        </tr> 
        <tr> 
        <td>3</td> 
        <td>Veronica</td> 
        <td>Gusikowski</td> 
        <td>@Maxime</td> 
        <td> 
         <span class="label label-warning">developer</span> 
        </td> 
        </tr> 
        <tr> 
        <td>4</td> 
        <td>Bruce</td> 
        <td>Rogahn</td> 
        <td>@Maggio</td> 
        <td> 
         <span class="label label-success">supporter</span> 
        </td> 
        </tr> 
        <tr> 
        <td>5</td> 
        <td>Carolina</td> 
        <td>Hickle</td> 
        <td>@Hammes</td> 
        <td> 
         <span class="label label-info">member</span> 
        </td> 
        </tr> 
        <tr> 
        <td>6</td> 
        <td>Madaline</td> 
        <td>Eichmann</td> 
        <td>@Amaya</td> 
        <td> 
         <span class="label label-success">supporter</span> 
        </td> 
        </tr> 
       </tbody> 
       </table> 
      </div> 
      </div> 
     </div> 
      </div> 
     </div> 
     <!-- End Example Panel With Heading --> 
     </div> 

Answer 1

何かがそれを行う必要があります... はわずか2列と行を作成し、あなたの列に欲しいものは何でも入れます。

<div class="row"> 
    <div class="col-sm-6"> 
     <div class="panel panel-bordered"> 
      <div class="panel-body"> 
       <h4>Body Heading</h4> 
       <p>Wrap buttons or secondary text in <code>.panel-footer</code>. Note 
        that panel footers do not inherit colors and borders when using 
        contextual variations as they are not meant to be in the foreground.</p> 
      </div> 
      <div class="panel-footer">Panel Footer</div> 
     </div> 
     <!-- End Example Panel With Footer --> 
    </div> 
    <div class="col-sm-6"> 
     <div class="panel panel-bordered"> 
      <div class="panel-body"> 
       <h4>Body Heading</h4> 
       <p>Wrap buttons or secondary text in <code>.panel-footer</code>. Note 
        that panel footers do not inherit colors and borders when using 
        contextual variations as they are not meant to be in the foreground.</p> 
      </div> 
      <div class="panel-footer">Panel Footer</div> 
     </div> 
     <!-- End Example Panel With Footer --> 
    </div> 
</div>