Formate für Grafiken in Tabellen anpassen
Die ausgegebene Bildgröße in Tabellen ändert sich in Abhängigkeit von der Angabe der Maximalbildbreite und der definierten Spaltenbreite .
Wichtig ist, dass die hier eingesetzten Grafiken, zumindest wenn sie in ein und derselben Tabelle platziert werden, im jeweils selben Format vorliegen.
Als weiterer Faktor kommen die Padding-Angaben in den CSS-Styleangaben für Tabellenzellen mit Bildern zum Tragen. Hier hilft es enorm, die paragraph_table.ccml um eine gesonderte Abfrage für den Fall, dass Tabellenzellen Bilder enthalten, zu erweitern und hierfür eine eigene Klasse (.tablepic) zuzuordnen.
#content td.tablepic {
border-top: 1px solid green;
border-right: 1px solid blue;
border-bottom: 1px solid blue;
border-left: 1px solid green;
padding: 0.3em;
text-align: center;
}
Je nach dem, was man realisieren will, muss man austarieren, was am besten passt. Es sollte eine Lösung gefunden werden, die für alle mit dem betreffenden Design erzeugten Webprojekte funktioniert.
Wer unterschiedlich aufgebaute Tabellen zum Präsentieren von Bildern einsetzt, kann sich gegebenenfalls mit verschiedenen Substyles behelfen, die einerseits identische Inhalte in Bezug auf Logografik (und was sonst noch darin definiert sein mag) enthalten, aber jeweils auf ein anderes Tabellentemplate zugreifen.
Die unterschiedlichen Tabellentemplates können dann für jede beliebige Variante formatiert und abgerufen werden.
Wie eine Tabelle mit zentrierten Grafikelementen und Textinhalten dargestellt werden kann, zeigt das folgende Beispiel.
| Finanzen | Recht | Werbung | Umwelt | Nachrichten | |
| Grafik |  |
 |
 |
 |
 |
| Text | Dieser Text beschreibt die oben abgebildete Grafik. Dieser Text beschreibt die oben abgebildete Grafik. | Dieser Text beschreibt die oben abgebildete Grafik. Dieser Text beschreibt die oben abgebildete Grafik. | Dieser Text beschreibt die oben abgebildete Grafik. Dieser Text beschreibt die oben abgebildete Grafik. | Dieser Text beschreibt die oben abgebildete Grafik. Dieser Text beschreibt die oben abgebildete Grafik. | Dieser Text beschreibt die oben abgebildete Grafik. Dieser Text beschreibt die oben abgebildete Grafik. |
