Blockquote Text versetzen

[Kopernikus]

Liebe Forenmitglieder,

ich bin recht guter Autodidakt für Programmierung etc. Ich habe für die Software Typora (Markdown Editor) ein eigenes Theme als .css gestaltetund bin damit auch soweit zufrieden. Allerdings komme ich aktuell bei einer Sache leider nicht weiter. Ich habe für eine Blockquote folgendes CSS geschrieben:

blockquote {
position: relative;
word-spacing: 0.06em;
margin: 0 1rem;
background-color: #f8f8f8;
line-height: 1.6;
border: solid transparent;
border-width: 0 0 0 4px;
border-radius: 8px;
background-image: linear-gradient(to bottom, #f8f8f8, #f8f8f8), linear-gradient(to bottom, #3e0668, #ffa039);
background-origin: border-box;
background-clip: content-box, border-box;
}

Und das hier ist das Ergebnis:
Ich würde gern, dass die 2. Zeile weiter weg vom linken Rand ist. Die Blockquote verwendet das Standard-Absatz Style des Themes, deshalb ist die 1. Zeile auch automatisch eingerückt. Leider komme ich grad mit den Folgezeilen nicht zurecht. Prinzipiell geht es also darum, den Text insgesamt nach rechts zu versetzen.

Vielen Dank schon mal für eure Hilfe
Nick

 

[Sempervivum]

Den Abstand kannst Du mit padding erzielen:
https://wiki.selfhtml.org/wiki/CSS/Eigenschaften/padding

 

[Kopernikus]

Das hatte ich ja auch gedacht, aber wenn ich z.B. "padding: 1.2em 30px 1.2em 30px;" als Test einfügen, dann kommt das dabei heraus:
Ich gehe davon aus, dass es am "linear-gradient" von "background-image" liegt, habe jedoch keine Lösung.

 

[Sempervivum]

OK, so einfach konnte es ja auch nicht sein. Dieses Blockquote benimmt sich beim Styling irgend wie merkwürdig und ich steige da nicht vollständig durch. Habe jedoch eine Workaround gebaut, indem ich ein div darum herum gelegt habe und auf dieses das Styling mit dem Farbverlauf angewendet, dann kann ich problemlos den Innenabstand mit padding einstellen:

    <div>
        <blockquote>
            Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et
            dolore
            magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita
            kasd
            gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur
            sadipscing
            elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At
            vero eos et
            accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum
            dolor sit
            amet.
        </blockquote>
    </div>

        div {
            position: relative;
            word-spacing: 0.06em;
            margin: 0 1rem;
            background-color: #f8f8f8;
            line-height: 1.6;
            border: solid transparent;
            border-width: 0 0 0 4px;
            border-radius: 8px;
            background-image: linear-gradient(to bottom, #f8f8f8, #f8f8f8), linear-gradient(to bottom, #3e0668, #ffa039);
            background-origin: border-box;
            background-clip: content-box, border-box;
        }

        blockquote {
            text-indent: 2em;
            margin: 0;
            padding: 0.5em 1em;
        }

Allerdings weiß ich nicht, ob das so für dich anwendbar ist weil Du schreibst:

Die Blockquote verwendet das Standard-Absatz Style des Themes

 

[Kopernikus]

Wow, ich schaue mir das an, wenn ich wieder zu Hause bin. Ggf. muss ich mal das komplette .css hochladen, ich habe leider bisher nicht herausfinden können, wie ich das Standard-Style des Themes abkopple und ein eigenes nehmen kann. Danke aber schon mal im Voraus!

 

[Kopernikus]

Sooo....ich musste mich jetzt erst einmal etwas weiter mit CSS beschäftigen, bevor ich antworte. Ich habe die Blockquote umgestellt und sortiere meine Anfrage noch mal etwas um bzw. genauer. So sieht meine Blockquote jetzt aus und ich bin soweit zufrieden:

Ich steuere das Aussagen in der Datei "prostat.css", welche meine individuelle Theme-Datei für den Markdown Editor Typora ist. Soweit so gut. Das eigentliche Theme von Typora wird, soweit ich es beurteilen kann, über ein oder zwei andere .css Dateien im Hauptordner der Software bestimmt. Ich habe die beiden Dateien auch mit angefügt: base.css und base-control.css.
In Typora selbst habe ich insgesamt 7 Absatz-Styles: 6 für Überschrift 1 bis 6 und eine für "Absatz", so heißt der Style im deutschen Menü. Der Blockquote verwendet diesen Style auch. Es gibt in den Einstellungen der Software die Möglichkeit, ein Häkchen bei "Erste Zeile des Absatzes einrücken" anzuklicken, dann würde die erste Zeile wie in meinem ersten Post eingerückt aussehen. Ich habe das aktuell deaktiviert, weil es für mich in der Blockquote nicht gut aussah. Ideal wäre es für mich, wenn ich ein weiteres Style für Absätze hinzufügen könnte, den ich dann bei den Blockquotes verwende. Aber ich bin mir nicht sicher, ob das geht.

Ideal wäre für mich wenn ich wüsste, wie man weitere Absatz-Styles einbaut, dann würde ich das auch tun. Ansonsten lasse ich es so, wie es aktuell ist.

Danke schon mal!