2017-05-08 5 views
0

私はBootstrap Material Designを使用していて、行の要素を整列するのに苦労しています(course.namecourse.updatecourse.deleteボタン)。ブートストラップの材質設計表の整列の問題

私はそれらをCSSと垂直に整列させたいが、vertical-align:middleは機能しません。どちらも<tr valign="middle">です。

何か助けていただければ幸いです。

{% if course_list %} 
    <table class="table table-hover"> 
     <tr> 
      <th>Course Name</th> 
     </tr> 
     {% for course in course_list %} 
      <tr> 
       <td><a class="text-nowrap" href="{% url "courses.detail" course.id %}">{{ course.name }}</a> 
        {% if course.instructor == user %} 
         <div class="pull-right"> 
          {% url 'courses.update' pk=course.id as url %} 
          {% bootstrap_button button_type='link' content='Edit' button_class='btn-warning' href=url %} 
          {% url 'courses.delete' pk=course.id as url %} 
          {% bootstrap_button button_type='link' content='Delete' button_class='btn-danger' href=url %} 
         </div> 
        {% endif %} 
       </td> 
      </tr> 
     {% endfor %} 
    </table> 

答えて

0

すべてのあなたのテーブルの最初のは、それがこの

<div class="table-responsive"> 
     <table class="table table-bordered table-striped"> 
     //rest of your code 
     </table> 
    </div> 

のような構造を行う応答それはあなたのテーブルが応答になりますと

.table td { 
    text-align: center; 
} 

または

<td class="text-center">some text</td> 
作るために、応答しません

中心にする整列

関連する問題