Problem mit nicht gewünschtem Absatz

[guidoi]

Hallo zusammen,

über den Social Icons einer Testseite zeigt mein Developer-Tool einen Absatz <p></p>, der für einen von mir nicht gewollten Abstand über den Social Icons sorgt.
Eigentlich sollen die Social Icons bündig sein mit der Box links und der Box in der Mitte.

Kann man das <p></<p> (CSS: .box .box-rechts) eliminieren?

http://jutta-ebling.hype-on.de/

Herzlichen Dank für eure Hilfe!

[planepix]

Halloguidoi,
entweder dem Absatz einen Innen- und Außenabstand von Null gegen.

Oder anstatt eines Inhaltelements Text HTML nehmen.

[Spooky]

Das passiert, weil du invalides HTML ausgeben lässt:

<div class="ce_text box box-rechts last block">
<p>
<ul class="socialicons">
<li><a href="https://www.facebook.com/trendRaum"><i class="fab fa-facebook"></i></a></li>
<li><a href="https://www.instagram.com/trendraum_juttaebling"><i class="fab fa-instagram"></i></a></li>
<li><a href="https://www.youtube.com"><i class="fab fa-youtube"></i></a></li>
<li><a href="https://www.twitter.com"><i class="fab fa-twitter"></i></a></li>
</ul></p>
</div>

In einem <p> darf sich kein <ul> befinden.

[guidoi]

Im Frontend-Modul habe ich kein <p></p> eingefügt, vermutlich wird dieser erzeugt, weil ich ein Text-Element genutzt habe?

<ul class="socialicons">
<li><a href="https://www.facebook.com/trendRaum"><i class="fab fa-facebook"></i></a></li>
<li><a href="https://www.instagram.com/trendraum_juttaebling"><i class="fab fa-instagram"></i></a></li>
<li><a href="https://www.youtube.com"><i class="fab fa-youtube"></i></a></li>
<li><a href="https://www.twitter.com"><i class="fab fa-twitter"></i></a></li>
</ul>

Ich habe nun statt Text ein HTML-Element gewählt und dort den Inserttag {{insert_module::7}} eingetragen.

Jetzt ist es oben bündig . Kann ich dennoch die CSS-Klassen .box .box-rechts vergeben, damit die Icons in der Box linksbündig erscheinen?

[Spooky]

Im Frontend-Modul habe ich kein <p></p> eingefügt, vermutlich wird dieser erzeugt, weil ich ein Text-Element genutzt habe?

Yep.

Ich habe nun statt Text ein HTML-Element gewählt und dort den Inserttag {{insert_module::7}} eingetragen.

Das ist auch die richtige Lösung.

Kann ich dennoch die CSS-Klassen .box .box-rechts vergeben, damit die Icons in der Box linksbündig erscheinen?

Ja, einfach direkt in deinem HTML-Element.

[guidoi]

Im HTML-Element kann ich keine CSS-ID/Klasse vergeben. Wie kann ich das dann ansteuern? Steh gerade auf dem Schlauch ...

[Spooky]

Du schreibst einfach eigenen HTML Code in deinem HTML Element. Dafür ist das HTML Element ja da

[planepix]

Im HTML-Code ergänzen.

[tab]

Schreib sie doch einfach ins HTML ...

[guidoi]

Das macht Sinn, ich danke euch!

Abstände auf 0 hat auch prima funktioniert.