WebsiteBaker Support (2.13.x) > Hilfe & Support (deutsch)

Abstände im div-Element mit wysiwyg

(1/2) > >>

StephanMuc:
Hallo miteinander,

vielleicht kann mir jemand erklären, wie/wo ich folgendes korrigieren kann:

einen im Backend (wysiwyg) erzeugter div-Container hat unnatürliche Abstände im Frontend (roter Pfeil im Bild)



weiss jemand, wie/wo ich das ändern kann?
Habe 2.13.5 r220 und nutze den Standard-Editor wysiwyg.
Freue mich über jeden freundlichen Hinweis.

Besten Dank & viele Grüße
Stephan

sternchen8875:

--- Quote from: StephanMuc on January 28, 2024, 10:30:13 PM ---einen im Backend (wysiwyg) erzeugter div-Container hat unnatürliche Abstände im Frontend

--- End quote ---

schwer zu beurteilen, wenn man selbst die Quelle nicht sieht. Vielleicht ist es dir möglich, einen Link zum Problem zu posten. Falls nicht, müssen wir das mit Screenshots versuchen zu klären. Am besten wäre dann ein Screenshot vom Quelltext der Seite im Frontend, die eben diesen Abschitt zeigt.
Du selbst könntest über die gängigen Browsertools auf Ursachenforschung gehen. Solch Tool ist meist mit der F12-Taste am Desktop oder Laptop zu starten, es reicht auch ein Rechtsklick auf z.b. das Wort Content im Frontend und dort der Punkt "Untersuchen". Dann kann man Div für Div mit der Maus überfahren und sieht dabei auch gleich die jeweiligen CSS-Einstellungen zu jedem Abschnitt.

Vielleicht schaltest du auch mal den Editor um auf Quellcode (oben links) und kontrollierst, ob vor den Tags der Überschrift (bei dir hier "Content") noch ein weiterer Tag vorhanden ist, ggf ein <p></p>

Abhilfe schafft möglicherweise schon das Umstellen des Section- bzw Abschnitts-Anker-Textes in den erweiterten WB-Optionen, Section Serversettings, Feld: Abschnitts-Anker Text. Den vorhandenen Text (default wäre das Sec) ändern in none
Die Angabe eines Abschnitts-Anker Textes führt dazu, das um jeden Abschnitt, also jede Section im Frontend noch ein weiteres DIV mit einer CSS-Klasse = section angelegt wird. Eventuell führt das bei dir zu einem vergrößerten Abstand von oben, dein Quelltext-Schnipsel im Screenshot läßt vermuten, das dann die Klasse = section zweimal verwendet wird, einmal von der Definition der section aus dem Template und ein zweites Mal vom Section-Anker-Text-DIV-Block, der um den page_content()-Block liegt

ruebenwurzel:
Hallo,

nutzt du eine editor.css?

In der editor.css wird das aussehren des contents im Backend gesteuert. Um im Backend dasselbe Design (auch div Abstände, zb.b margin, padding, ...) wie im Frontend zu haben kann man im einfachsten Fall eine Kopie der .css Datei für das Frontend als editor.css im Root des von dir verwendeten Templates speichern. Oft sind aber Anpassungen erforderlich. Wenn der Contentbereich in der .css des von dir verwendeten Templates eine eigene Klasse (z.b. div {class = "container" }) hat, dann müssen die in dieser Klasse definierten Einstellungen in der editor.css direkt in den html Bereich rein.

StephanMuc:
Danke sternchen8875 & ruebenwurzel,

habe schon all diese Dinge versucht, sehe gerade leider kein Licht am Ende des tunnels. Vermutlich verenne ich mich hier in etwas und die Lösung ist viel einfacher als gedacht!?

Hier das Problem:
https://www.valdoclub.de/pages/testseite.php

...selsbtverständli ch gehe ich auch nochmal Eure Tipps durch und hoffe, dass ich dem Übel auf die Schliche komme ;-)


Aus meiner Sicht liegt das Über innerhalb des div containers, welcher vom wysiwyg Editor erzeugt wird:


...keine Ahnung, wie dieser im WB erzeugt wird :-(

Danke erstmal & beste Grüße
Stephan

sternchen8875:

--- Quote ---habe schon all diese Dinge versucht, sehe gerade leider kein Licht am Ende des tunnels. Vermutlich verenne ich mich hier in etwas und die Lösung ist viel einfacher als gedacht!?
--- End quote ---

eine einfache Erklärung und ohne Streß für dich zu lösen
Es ist so wie vermutet, der WB-Abschnittsankertext erzeugt hier ein zweites DIV, für das lt. style.css in Zeile 185 für die CSS-Klass=section ein Abstand von oben (und unten) mit 80px eingestellt ist (siehe Markierungen der Pfeile im Bild)

Gehe zu OPTIONEN, klicke rechts am Rand auf ERWEITERTE OPTIONEN anzeigen, scroll runter zum Abschnitt Servereinstellungen und ändere den Feldinhalt bei Abschnitts-Anker Text: von Sec auf none - (Schreibweise ist wichtig - alles Kleinbuchstaben)
einmal Speichern, erledigt




WB-Optionen (ganz unten)

Navigation

[0] Message Index

[#] Next page