Как выровнять одну таблицу влево и одну вправо BOOTSTRAP

У меня есть две таблицы, и я хотел бы выровнять один налево, а другой направо - но у меня проблемы.Как выровнять одну таблицу влево и одну вправо BOOTSTRAP

Это мой код:

<!-- Latest compiled and minified CSS --> 
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" integrity="sha384-1q8mTJOASx8j1Au+a5WDVnPi2lkFfwwEAa8hDDdjZlpLegxhjVME1fgjWPGmkzs7" crossorigin="anonymous"> 

<!-- Optional theme --> 
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap-theme.min.css" integrity="sha384-fLW2N01lMqjakBkx3l/M9EahuwpSfeNvV63J5ezn3uZzapT0u7EYsXMjQV+0En5r" crossorigin="anonymous"> 

<!-- Latest compiled and minified JavaScript --> 
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js" integrity="sha384-0mSbJDEHialfmuBBQP6A4Qrprq5OVfW37PRR3j5ELqxss1yVqOtnepnHVP9aJ7xS" crossorigin="anonymous"></script> 

<?php 

    print 
    "<div class='container'>". 
     "<table class='table'>". 
     "<tr>". 
      "<th class='text-left'>Product Shot</th>". 
      "<th class='text-center'>Product Description</th>". 
      "<th class='text-center'>Quantity</th>". 
      "<th class='text-center'>Total</th>". 
     "</tr>". 
    "</table>"; 

    print 
     "<tr>". 
      "<td><b>Grand total: </b></td>". 
      "<td><strong>'TOTAL'</strong></td>". 
      "<td>". 
       "<a href='#'><button class='btn btn-success'> Checkout</button></a>". 

       "<a href='remove_all_items.php'><button class='btn btn-danger'> Remove </button></a>". 

       "</a>". 
      "</td>". 
    "</tr>"; 

?>

Возможно ли это иметь две таблицы на той же странице, где один находится на левой стороне, а другой справа и отзывчив и прокручивается вниз?

Как я могу достичь этого?

Благодаря

источник

2016-04-06 Anonymous

Вы пробовали тянуть влево и тянуть вправо? –

Кроме того, где

для вашего второго стола? –

ответ

попробовать сделать класс CSS с !important кода в нем

пример:

txtleft 
{ 
    text-align:left !important; 
} 
txtryt 
{ 
    text-align:right !important; 
} 
txtcent 
{ 
    text-align:center !important; 
}

и попробовать его поместить в ваши классы

некоторые классы начальной загрузки наследуется по классам их родителей. но с использованием кода !important; он не будет изменен вышестоящим

Надеется, что это помогает ...

источник

2016-08-05 03:23:18 Darence30

вы можете попробовать, как это:

<body> 
<div class="container"> 
    <div class="row"> 
     <div class="col-xs-6"> 
     <table> 
      <tr> 
       <td>left</td> 
       <td>left</td> 
      </tr> 
     </table> 
     </div> 
     <div class="col-xs-6"> 
     <table> 
      <tr> 
       <td>right</td> 
       <td>right</td> 
      </tr> 
     </table> 
     </div> 
    </div> 
</div> 
</body>

источник

2016-08-05 03:37:51

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