Verwendung: margin-top bei Text in Rocksolid-Columns

shopmail's Avatar

shopmail

29 Oct, 2017 08:47 AM

Produkt: Open Sauce Contao
Contao-Version: Contao 3.5.30 / Theme 1.4.5
Browser und Browserversionen: Alle

Hallo,
ich habe in einem Spaltenset in der linken Spalte ein Foto, in der rechten Spalte einen Text.
Der Text hat aber einen margin-top und beginnt nicht auf der gleichen Höhe wie das Bild.
Welche Anpassungen müssen vorgenommen werden, damit der Text auf der gleichen Höhe wie das Bild beginnt.
Es wurden in der Installation beim Theme nur Farbangaben verändert, in der custom.css sind keine Abstandsformatierungen enthalten.
Die erforderlichen Screenshots sind im Anhang enthalten.

P.S.: Bitte den Link nicht veröffentlichen bzw. wieder entfernen, Danke.

  1. Support Staff 1 Posted by RockSolid Theme... on 30 Oct, 2017 08:21 AM

    RockSolid Themes's Avatar

    Vielen Dank für Ihre Frage.

    Sie können den Abstand des Textes entfernen indem Sie folgenden CSS-Code in die Datei files/opensauce/css/custom.css einfügen:

    .rs-column > .ce_text:first-child > p:first-child {
        margin-top: 0;
    }
    
  2. 2 Posted by shopmail on 02 Nov, 2017 07:43 AM

    shopmail's Avatar

    Hallo,
    Danke für die Antwort, der Textabstand wird jetzt wie gewünscht angezeigt.

    Jetzt habe ich ein Spaltenset bei dem das Foto in der rechsten Spalte angezeigt wird, hier ist die Darstellung in der zweispaltigen Ansicht richtig. Wenn man aber auf die mobile Ansicht <599px wechselt, wird oberhalb des Fotos ein doppelter Margin ausgegeben. Wie kann dieser entfernt werden?
    Der Link zur Seite ist gleich geblieben.

    Danke für Ihre Antwort.

  3. Support Staff 3 Posted by RockSolid Theme... on 02 Nov, 2017 08:42 AM

    RockSolid Themes's Avatar

    Versuchen Sie es bitte mit folgendem CSS-Code:

    .rs-column > .ce_text:last-child > p:last-child {
        margin-bottom: 0;
    }
    
  4. 4 Posted by Norbert on 14 Feb, 2019 08:58 AM

    Norbert's Avatar

    Ich möchte zu diesem Thema auch noch eine Frage anhängen.

    In der Desktop Version verwende ich 2 Spalten, in der Tablet und Mobil Version jeweils 1 Spalte. Ein zwei-spaltiger Text wird in der Desktop Version wie gewünscht dargestellt. Schaltet das Layout auf die ein-spaltige Version, rückt der Text der zweiten Spalte wie gewünscht unter den Text der ersten Spalte, allerdings weißt der zweite Text einen zu großen Abstand nach oben auf. Dies stört die Optik des Layouts. Wie kann ich hier den Abstand zwischen den beiden Textblöcken anpassen???

    Vielen Dank.

  5. Support Staff 5 Posted by RockSolid Theme... on 15 Feb, 2019 07:36 AM

    RockSolid Themes's Avatar

    Vielen Dank für Ihre Frage.

    Vertikale Abstände lassen sich in der Regel durch die CSS-Eigenschaften margin-top und margin-bottom steuern. Damit wir Ihnen zielgerichteter weiterhelfen können, schicken Sie uns bitte einen Link zur betroffenen Seite.

Reply to this discussion

Internal reply

Formatting help / Preview (switch to plain text) No formatting (switch to Markdown)

Attaching KB article:

»

Already uploaded files

  • custom-css.JPG 62.8 KB
  • opensauce-bildabstand.JPG 149 KB
  • opensauce-bildabstand-config-1.JPG 91.6 KB
  • opensauce-bildabstand-config-2.JPG 66.3 KB

Attached Files

You can attach files up to 10MB

If you don't have an account yet, we need to confirm you're human and not a machine trying to post spam.

Keyboard shortcuts

Generic

? Show this help
ESC Blurs the current field

Comment Form

r Focus the comment reply box
^ + ↩ Submit the comment

You can use Command ⌘ instead of Control ^ on Mac