2016-12-20 2 views
0

ich Mitte ausrichten wollen nach dem - wie kann ich das tun:Wie kann ich ausrichten Mitte Text und Bilder in Tabellenzeile

<div class="container-fluid" style="height:100%"> 
 
    <table id="PulseTable" class="display2" style="height:100%"> 
 
     <tbody id="PulseBody" style="height:100%"><tr class="pulseheader"> 
 
<td class="pulseheader" style="padding-top: 10px; padding-bottom: 10px; font-size: 16px; font-weight: bold;">Manager</td> 
 
</tr> 
 
<tr class="pulseline" style="height: 20px;"> 
 
<td class="pulseline" style="padding-left: 40px; font-size: 12px; font-style: normal;">Header</td> 
 
<td class="pulseline" style="padding-left: 20px; font-size: 12px; font-style: normal;">New York II</td> 
 
<td class="NONE" style="padding-left: 20px;"><img src="http://blog.sckyzo.com/wp-content/google-small.png" style="height: 30px; width: auto;"></td> 
 
</tr> 
 
     <tbody> 
 
    </table> 
 
</div>

Antwort

0

Ich hoffe, dass es für Sie arbeitet

.container-fluid{ 
position:relative; 
margin: 0px auto; 
} 
1

Um sie horizontal innerhalb jeder Tabellenzelle zu zentrieren, verwenden Sie:

um sie zentriert vertikal (dies funktioniert nur mit Tabellen oder Elemente mit display: table-cell):

vertical-align: middle; 

Übernehmen Sie diese Stile auf die <td> Element.

<table> 
    <tr> 
    <td style="text-align: center; vertical-align: middle;"> 
      Foo bar 
    </td> 
    </tr> 
</table> 
+0

Nein - der zweite funktioniert nicht. Die erste ist nicht was ich wollte – ManInMoon

+0

Hast du die Stile auf das '' Element angewendet? Ich habe der Antwort ein Beispiel hinzugefügt – slezica

+0

Ja, ich habe - immer noch nicht funktioniert. – ManInMoon

0

Sie müssen COLSPAN verwenden, um die Zelle in der ersten Zeile zu fusionieren und auch CSS-Stil verwenden "text-align: center", um es Mitte tun ausrichten:

<div class="container-fluid" style="height:100%"> 
 
    <table id="PulseTable" class="display2" style="height:100%"> 
 
     <tbody id="PulseBody" style="height:100%"><tr class="pulseheader"> 
 
<td class="pulseheader" colspan="3" style="padding-top: 10px; padding-bottom: 10px; font-size: 16px; font-weight: bold; text-align: center">Manager</td> 
 
</tr> 
 
<tr class="pulseline" style="height: 20px;"> 
 
<td class="pulseline" style="padding-left: 40px; font-size: 12px; font-style: normal;">Header</td> 
 
<td class="pulseline" style="padding-left: 20px; font-size: 12px; font-style: normal;">New York II</td> 
 
<td class="NONE" style="padding-left: 20px;"><img src="http://blog.sckyzo.com/wp-content/google-small.png" style="height: 30px; width: auto;"></td> 
 
</tr> 
 
     <tbody> 
 
    </table> 
 
</div>

+0

Das ist nicht in der Mitte ausgerichtet - ist es? – ManInMoon

Verwandte Themen