Responsive Bild in den Tabellen

Ich muss einen Newsletter erstellen und die Firma will nicht divs, nur Tabellen. Außerdem muss es browserübergreifend kompatibel sein. SO kann nicht verwenden, Display, reagierende Schriftarten, solche Sachen. Und alles CSS muss inline sein.Responsive Bild in den Tabellen

In ein paar Zellen muss ich 3 Bilder, eins in jedem, mit der gleichen Größe perfekt in einer Reihe ausgerichtet haben. Sie müssen auf die Größe der Zelle reagieren und 100% des td einnehmen.

Das Problem ist, dass wenn der Browser die Größe ändert, die Bilder unterscheiden sich von einer anderen Größe. Beispiel: Wenn sich die Breite des Browsers ändert, wird Pic1 Breite 150px, aber Pic2 geht 152px. Pic3 geht 151px.

Gibt es eine Möglichkeit dies zu verhindern?

Ein kleines Beispiel von dem, was ich sage. Die Bilder haben die gleiche Größe gibt, aber sie unterscheiden sich nach wie vor voneinander. (Natürlich die Bilder lokal gespeichert werden, so dass Sie wirklich nichts sehen kann nicht. Gerade hier veröffentlichen eine Vorstellung von dem Code zu geben.)

<!DOCTYPE html> 
<html> 
<head> 
    <title>Table Test</title> 
</head> 
<body> 
    <table cellspacing=0 cellpadding=0 style=" width:80%; "> 

     <tr> 
      <td style="border: 2px solid #000;"> 
       <img style=" width: 100%; display:block" src="1.png"> 
      </td > 
      <td style="border: 2px solid #000;"> 
       <img style=" width: 100%; display:block" src="2.png"> 
      </td > 
      <td style="border: 2px solid #000;"> 
       <img style=" width: 100%; display:block" src="1.png"> 
      </td> 
     </tr> 

    </table> 
</body> 
</html>

Vielen Dank im Voraus für jeden, der mir helfen kann. ;)

Quelle

2016-11-22 rbossan

Tabellen für tabellarische Daten nicht für Seitengestaltung gedacht sind img. Warum kannst du keine divs benutzen? – mlegg

Die meisten E-Mail-Clients behandeln Divs nicht so gut. Da dies ein Newsletter ist, möchte das Unternehmen, in dem ich arbeite, Tabellen verwenden. – rbossan

versuchen diese Klasse anhängen

.img-responsive 
{ 
    display: block; 
    max-width: 100%; 
    height: auto; 
}

Quelle

2016-11-23 03:15:05

Mein Arbeitgeber wurde etwas flexibler bei diesem Thema. Also keine Notwendigkeit dafür. Aber danke für die Hilfe;) – rbossan

Responsive Bild in den Tabellen

Antwort

Verwandte Themen