2017-10-17 1 views
0

Versuchen, diese Art von Design/Struktur zu replizieren: Beachten Sie unten die zwei Felder auf der einen Seite des Tisches und die eine große auf der anderen Seite! enter image description here Wie würde ich dies mit Tabelle CSS erreichen? Hier ist mein aktueller Code, die vertikal gestapelt ist:Wie css Tabellenelemente horizontal ausrichten?

<body> 

<table border="0" cellpadding="0" cellspacing="0" height="100%" width="100%" id="bodyTable"> 
<tr> 
    <td align="center" valign="top"> 
     <table border="0" cellpadding="20" cellspacing="0" width="600" id="emailContainer"> 
      <tr> 
       <td align="center" valign="top"> 
        <table border="0" cellpadding="20" cellspacing="0" width="100%" id="emailHeader"> 
         <tr> 
          <td align="center" valign="top"> 
           This is where my body content goes. 
          </td> 
         </tr> 
        </table> 
       </td> 
      </tr> 
      <tr> 
       <td align="center" valign="top"> 
        <table border="0" cellpadding="20" cellspacing="0" width="100%" id="emailBody"> 
         <tr> 
          <td align="center" valign="top"> 
           This is where my body content goes. 
          </td> 
         </tr> 
        </table> 
       </td> 
      </tr> 
      <tr> 
       <td align="center" valign="top"> 
        <table border="0" cellpadding="20" cellspacing="0" width="100%" id="emailFooter"> 
         <tr> 
          <td align="center" valign="top"> 
           This is where my body content goes. 
          </td> 
         </tr> 
        </table> 
       </td> 
      </tr> 
     </table> 
    </td> 
</tr> 
</table> 

</body> 

Jede Idee ?:

+0

meine Antwort sehen! ich versuchte mein Bestes! –

+0

Untersuchen Sie mit Flex-Design. Es wird tun, was Sie brauchen, mit erheblich weniger Code. – jfeferman

+0

Kannst du meine Antwort akzeptieren, wenn du glaubst, dass es gut ist? –

Antwort

1

Steven ist richtig, in theory:

die „richtige“ Art und Weise eine Tabelle mit CSS zu zentrieren. Übereinstimmende Browser sollten Tabellen zentrieren, wenn der linke und der rechte Rand gleich sind. Der einfachste Weg dies zu tun ist, um die linken und rechten Rand setzen So könnte man in einem Stylesheet schreiben „auto.“:

table 
{ 
    margin-left: auto; 
    margin-right: auto; 
} 

Aber der Artikel am Anfang dieser Antwort erwähnt gibt Ihnen all die andere Art, einen Tisch zu zentrieren.

Eine elegante css Cross-Browser-Lösung: Dies sowohl in MSIE 6 arbeitet (Quirks und Standards), Mozilla, Opera und Netscape 4.x auch ohne explizite Breiten einstellen:

div.centered 
{ 
    text-align: center; 
} 

    div.centered table 
{ 
    margin: 0 auto; 
    text-align: left; 
} 


    <div class="centered"> 
    <table> 
    … 
    </table> 
</div> 

diesen post ansehen

bearbeiten thats center das ist horizontal ändern Sie einfach das neccecery css oder sehen here!

+0

Warum schreist du uns in großem, fettem Text an? – FluffyKitten

+0

Ich bin nicht. Entschuldigung krank entfernen Fett, aber es war, es auffallen zu lassen –

Verwandte Themen