2016-08-12 2 views
-1

Я хочу выровнять таблицу внутри div в правой части div, но они выровнены влево, что не так с моим css? У меня есть таблица внутри div, в которой содержится текст и изображение, и я хочу, чтобы таблица с правой стороны использовала align = right в таблице. И некоторые таблицы, которые я хотел бы выровнять с левой стороны, как я могу выровнять некоторые таблицы с правой стороны на странице или в некоторых таблицах слева на той же странице? БлагодаряКак я могу выровнять право содержания в div

enter image description here

<!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> 
+0

Вы пробовали 'поплавка: right' на столе? Есть также класс Bootstrap 'pull-right', который делает то же самое :) –

+0

Это весь ваш HTML-код? Вы используете Bootstrap? – Lee

+1

'align' устарел и больше не должен использоваться. Вместо этого следует использовать другие методы выравнивания. –

ответ

0

Пожалуйста, обновите ваш код в соответствии с этим. Проблема, .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> 
 

 
      

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