如何對齊div中的內容的權利

-1

我想將div內的表格對齊到div的右側，但它們對齊到左側，我的css出了什麼問題？我在div中有表格，裏面包含一個文本和一張圖片，我想要的是將表格放在右側，在表格中使用align = right。而我想在左側對齊一些表格，我怎樣才能將頁面右側的某些表格或同一頁面左側的某些表格對齊？由於如何對齊div中的內容的權利

<!DOCTYPE html> 
    <html> 
     <head> 
      <title>Landing</title> 

      <style> 
      .form-section{ 
       margin:15px; 
      } 
      </style> 
     </head> 
     <body> 
      <div class="jumbotron" align="center"> 
       <img src="/static/img/Chaatz-192x192px.jpg" class="img-responsive" alt="Responsive image" style="width:10%;height:10%"> 
       <h2></h2> 
      </div> 
      <div class="container"> 
       <div class="row"> 
       <div class="row" style="width:100%"> 
     <form class="form-horizontal"> 


         <table align="right"> 
          <tr> 
           <td> 
            test(user11) 
            H111i 
            2016-08-12 07:46:22 
           </td> 
           <td><img src=http://d2h8t8into6exa.cloudfront.net/user_comic_avatars/VkKDIkBHsd.jpg alt="Smiley face" height="80" width="80"></td> 
          <tr> 
         </table> 
         <br> 




         <table align="right"> 
          <tr> 
           <td> 
            test(user11) 
            H111i 
            2016-08-12 07:46:21 
           </td> 
           <td><img src=http://d2h8t8into6exa.cloudfront.net/user_comic_avatars/VkKDIkBHsd.jpg alt="Smiley face" height="80" width="80"></td> 
          <tr> 
         </table> 
         <br> 




    <style> 
    .multiline 
    { 
     padding:0px; 
     white-space: pre-wrap; 
     height: 100px; 
     width: 50%; 
     margein:0px 
    }  
     .row { 
     display: flex; 
    }  
    td { white-space:pre } 

    </style>

來源

2016-08-12 want_to_be_calm

你試過'浮動：上表right'？還有一個Bootstrap類'pull-right'，可以做同樣的事情:) –

這是你的整個HTML代碼嗎？你在使用Bootstrap嗎？ – Lee

'align'已被棄用，不應再使用。應該使用其他對齊方法。 –

請更新您的代碼按本。問題.row應該以'col-`作爲他們的孩子作爲標準做法。

.multiline 
 
{ 
 
    padding:0px; 
 
    white-space: pre-wrap; 
 
    height: 100px; 
 
    width: 50%; 
 
    margein:0px 
 
}    
 
td { white-space:pre } 
 

 
.user-table{width:100%;} 
 
.user-table tr > td{ 
 
    text-align:right; 
 
}

<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet"/> 
 
<div class="jumbotron" align="center"> 
 
    <img src="/static/img/Chaatz-192x192px.jpg" class="img-responsive" alt="Responsive image" style="width:10%;height:10%"> 
 
    <h2></h2> 
 
</div> 
 
<div class="container"> 
 
    <div class="row"> 
 
     <form class="form-horizontal"> 
 
      <div class="col-sm-12 col-md-12">  
 
       <table class="user-table"> 
 
        <tr> 
 
         <td> 
 
          test(user11) 
 
          H111i 
 
          2016-08-12 07:46:22 
 
         </td> 
 
         <td><img src=http://d2h8t8into6exa.cloudfront.net/user_comic_avatars/VkKDIkBHsd.jpg alt="Smiley face" height="80" width="80"></td> 
 
        <tr> 
 
       </table> 
 
      </div> 
 
      <div class="col-sm-12">              
 
       <table class="user-table"> 
 
        <tr> 
 
         <td> 
 
          test(user11) 
 
          H111i 
 
          2016-08-12 07:46:21 
 
         </td> 
 
         <td><img src=http://d2h8t8into6exa.cloudfront.net/user_comic_avatars/VkKDIkBHsd.jpg alt="Smiley face" height="80" width="80"></td> 
 
        <tr> 
 
       </table> 
 
      </div> 
 
     </form> 
 
    </div> 
 
<div>

來源

2016-08-12 09:52:51

如何對齊div中的內容的權利

回答

相關問題