100% Breite Tabelle mit drei Spalten in div

Ich versuche, eine Webseite mit einer Tabelle in einem div zu machen. Die Tabelle hat eine Breite von 100% mit drei Spalten. Aber wenn ich die Größe des Fensters ändere, passt die Tabelle seine Breite nicht an.100% Breite Tabelle mit drei Spalten in div

Dies ist der Code Ich verwende:

<!doctype html> 
<html> 
<head> 
<meta charset="utf-8"> 
<title>Test</title> 
</head> 

<body> 
<div style="width: 1400px; margin-left: auto; margin-right: auto"> 
    <table width="100%" border="0"> 
    <tbody> 
     <tr> 
     <td style="background-color: aqua; padding-left: 10px; padding-right: 10px; padding-top: 10px">Text.</td> 
     <td style="background-color: #DD185B; padding-left: 10px; padding-right: 10px; padding-top: 10px">Text.</td> 
     <td style="background-color: aqua; padding-left: 10px; padding-right: 10px; padding-top: 10px">Text.</td> 
     </tr> 
    </tbody> 
    </table> 
</div> 
</body> 
</html>

Quelle

2017-05-31 Nees

Tabelle ist 100% der Breite Geordnetes Element. In Ihrem Fall ist das Elternelement ein DIV mit fester Breite von 1400px. Entfernen Sie die Eigenschaft width des übergeordneten DIV. –

einfach Ihre width: 1400px ändern max-width: 1400px;

Breite festgelegt ist, max Breite ist die max Sie gehen kann.

<!doctype html> 
 
<html> 
 

 
<head> 
 
    <meta charset="utf-8"> 
 
    <title>Test</title> 
 
</head> 
 

 
<body> 
 
    <div style="max-width: 1400px; margin-left: auto; margin-right: auto"> 
 
    <table width="100%" border="0"> 
 
     <tbody> 
 
     <tr> 
 
      <td style="background-color: aqua; padding-left: 10px; padding-right: 10px; padding-top: 10px">Text.</td> 
 
      <td style="background-color: #DD185B; padding-left: 10px; padding-right: 10px; padding-top: 10px">Text.</td> 
 
      <td style="background-color: aqua; padding-left: 10px; padding-right: 10px; padding-top: 10px">Text.</td> 
 
     </tr> 
 
     </tbody> 
 
    </table> 
 
    </div> 
 
</body> 
 

 
</html>

Quelle

2017-05-31 17:47:26

Thnx m8! Funktioniert gut. – Nees

@Nees, was mit der angenommenen Antwort ~ ~ ~ passiert ist? –

Weiß nicht, akzeptierte es erneut. – Nees

Die Breite der Tabelle ist zu 100% des Elements Eltern, Ihre div in diesem Fall. Ihr div ist auf 1400px eingestellt, daher ist die Tabelle auch 1400px.

Quelle

2017-05-31 17:43:18 Kee225

div Breite ist die CSS-Eigenschaft zu beheben.

https://jsfiddle.net/jst9u4zv/

<div style="margin-left: auto; margin-right: auto"> 
    <table width="100%" border="0"> 
    <tbody> 
     <tr> 
     <td style="background-color: aqua; padding-left: 10px; padding-right: 10px; padding-top: 10px">Text.</td> 
     <td style="background-color: #DD185B; padding-left: 10px; padding-right: 10px; padding-top: 10px">Text.</td> 
     <td style="background-color: aqua; padding-left: 10px; padding-right: 10px; padding-top: 10px">Text.</td> 
     </tr> 
    </tbody> 
    </table> 
</div>

Quelle

2017-05-31 17:44:18 tech2017

100% Breite Tabelle mit drei Spalten in div

Antwort

Verwandte Themen