-
Artikel Text Randabstand
Hallo
Ich bin ganz neu bei Contao, arbeitete vorher mehrere Jahre mit CMSimple, dessen Zeiten sind jedoch vorbei.
Die HP die ich anstrebe soll sehr einfach gestaltet sein, die muss auch nicht viele Anforderungen erfüllen. Ich möchte wenn möglich keine oder nur minimal CSS verwenden müssen. Mit den Strukturen, Seitenlyout, Modulen, Artikel etc. kam ich relativ schnell ins Klare. Nun habe ich das Problem dass mir der Text eines Artikels genau bis an den Rand der entsprechenden Spalte kommt. Daher wenn ich z.B. einen Textartikel in der Hauptspalte habe und einen solchen in der rechten Spalte, so berühren sich die beiden Texte, das sieht hässlich aus und ist kaum mehr leserlich. Irgendwo sollte doch der Wert links und rechts eingestellt werden können, wie viel Abstand der Text vom Spaltenrand haben sollte. Habe mich da auch bei CSS rumgeschaut, jedoch nichts gefunden, und wüsste im Moment auch nicht wo ich diesen Einbauen sollte. Am liebsten wäre mir natürlich wenn man dies direkt in Cantao einstellen könnte.
-
Typischerweise ist hier ein Padding erforderlich. Das hängt aber natürlich auch von deinem Layout ab. Bei einem Grid-Layout mag es anders aussehen als bei einem der vordefinierten Layouts von Contao.
-
Das Padding sagt mir im Moment nicht viel, wenn dies die Lösung wäre, könnte ich mich darüber mal schlauer machen. Das mit dem Seitenlayout stimmt schon, je nach dem ob ich auf 960 px oder 90% stelle sieht das ganze mit den Textrandabständen besser aus. Beim Betrachten auf einem schmalen Bildschirm, z.B. Smartphone, kommt der Text jedoch immer bis ganz an den Rand. Ich suche halt was, wo ich einstellen kann dass die Textbreite immer einen Wert kleiner als die entsprechende Spalte ist.
-
Ich sehe gerade, du schreibst von Hauptspalte und rechte Spalte. Das hast du normalerweise HTML-Strukturen wie
HTML-Code:
<main id="main">
<div class="inside">
und
HTML-Code:
<aside id="right">
<div class="inside">
Die "<div class="inside"> sind dazu gedacht, hier die entsprechenden Styles wie Padddings anzubringen. Die bräuchte man heute nicht mehr unbedingt, sie sind aber immer noch praktisch.
Mit z.B.
Code:
#main .inside {
padding: 1em;
}
#right .inside {
padding: 1em;
}
verhinderst du, dass Texte bis an die eigentlichen Grenzen der Spalten reichen, im Beispiel auf allen Seiten. Man weist das nicht direkt #main und #right direkt zu, weil dadurch die Breite der Spalten sich vergrößern würde, woran das Layout, so wie es der Layoutbuilder erzeugt, zerbrechen würde.
