Eine Ausrichtung mit dem exakten Titel "Bild rechts oben" gibt es nicht.
Da die Überschrift ebenfalls neben dem Bild liegt in deinem Screenshot, meinst du wahrscheinlich Neben dem Text rechts [25] oder?
Ich würde das mit CSS per Flexbox lösen. Flex-Items können per flex-direction nebeneinander/untereinander in der Reihenfolge vorwärts/rückwärts positioniert werden. Per Media Query kannst du das dann entsprechend umstellen.
Für die Ausrichtung Neben dem Text rechts [25] im speziellen könnte das dann so aussehen:
.ce-textpic.ce-right.ce-intext.ce-nowrap {
display: flex;
flex-direction: column-reverse;
gap: 10px;
}
@media screen and (min-width: 768px) {
.ce-textpic.ce-right.ce-intext.ce-nowrap {
flex-direction: row-reverse;
}
}
Falls du die Default-Styles aus EXT:fluid_styled_content/Configuration/TypoScript/Styling/setup.typoscript eingebunden hast, müsstest du zusätzlich noch ein paar Stile überschreiben:
.ce-textpic.ce-right.ce-intext.ce-nowrap > .ce-gallery {
float: none;
margin-left: 0;
}
.ce-textpic.ce-right.ce-intext.ce-nowrap,
.ce-textpic.ce-right.ce-intext.ce-nowrap .ce-bodytext,
.ce-textpic.ce-right.ce-intext.ce-nowrap .ce-gallery,
.ce-textpic.ce-right.ce-intext.ce-nowrap .ce-row {
overflow: unset;
}
Mit diesen Infos kannst du das Verhalten nun sicherlich auch auf Neben dem Text links [26] umschreiben, damit es in beiden Richtungen ein einheitliches Verhalten ergibt.
Flexbox bietet neben flex-direction im Flex-Container sogar die Möglichkeit mit Hilfe der CSS-Eigenschaft order im Flex-Item vollkommen frei die position der Flex-Items auf der jeweiligen Achse zu bestimmen.
Für alle Details zum Thema Flexbox schau dir mal diese Zusammenfassung an:
https://css-tricks.com/snippets/css/a-guide-to-flexbox/
Für komplexere Umpositionierungen empfiehlt sich ansonsten auch ein Blick in CSS Grid Layouts. Während Flexbox 1-dimensional arbeitet (horizontal oder vertikal) hast du mit Grid Layouts 2-dimensional die Möglichkeit die Position der Elemente in beiden Achsen zu bestimmen.
EDIT: Ich habe zu spät gesehen, dass im Titel dieses Threads "Bootstrap" steht. Falls du damit das Bootstrap Package meinst, müssten die CSS Stile anders formuliert werden, da EXT:fluid_styled_content dort nicht verwendet wird. Ich denke aber das Grundprinzip zur Ausrichtung von Text und Bild in Abhängigkeit von der Anzeigefläche des Endgerätes sollte rüber gekommen sein.
