5202

ein Blog über technische Fragen zu Blogger

Dynamische Ansichten: Bilder in Reihe

von



Original Entsättigt

Update

Bitte beachten: Ich habe in der Zwischenzeit eine Lösung gefunden, die das Problem mehrere-Bilder-in-einer-Reihe nur mit dem Blogger-Editor hinbekommt.

Es ist schwierig [unmöglich?], mit hauseigenen Mitteln des Blogger Editors zwei Bilder plus Untertitel nebeneinander zu setzen. Deswegen hier noch mal ein Tabellenlayout als Vorlage:
<table style="margin-left: auto; margin-right: auto; text-align: center;">
<tbody>
<tr>
<td><a href="http://goo.gl/5jwMF"><img class="bild" src="http://goo.gl/5jwMF"/></a></td> 
<td><a href="http://goo.gl/wMhwG"><img class="bild" src="http://goo.gl/wMhwG"/></a></td>
</tr>
<tr><td>Original</td><td>Entsättigt</td>
</tr>
</tbody>
</table>

Anpassen

Zeile 1 enthält <style> Anweisungen; die Tabelle wird mit margin-left: auto; margin-right: auto; im Postfeld zentriert. Falls sie links.- oder rechtsbündig stehen soll, streicht einen der beiden Werte. Der Inhalt der Tabelle wird mit text-align:center; zentriert.

Der Abstand zwischen den Bilder wird in den 'dynamic Views' von einem Script geregelt und das ändert sich von 'View' zu 'View', deswegen beschreibe ich den Abstand besser mit einer Klasse und CSS-Regel, als im Fall des Falles bei einem 'View'-Wechsel das ganze im HTML vom Post zu editieren.

Altes Dashboard-Layout
Design > Vorlagendesigner > Erweitert > CSS hinzufügen > Code einsetzen > drückt die Eingabe-Taste hinter dem letzten Zeichen } der letzten Zeile > Auf Blog anwenden

Neues Dashboard-Layout
Dashboard > Vorlage > 'Live im Blog' anpassen > Erweitert > CSS hinzufügen > Code einsetzen > drückt die Eingabe-Taste hinter dem letzten Zeichen } der letzten Zeile > Auf Blog anwenden

Code:

.article .article-content img:not(.deferred) {
    margin: 0 1em;
}