XHTMLforum

XHTMLforum (http://xhtmlforum.de/index.php)
-   CSS (http://xhtmlforum.de/forumdisplay.php?f=73)
-   -   Shortcode "individuell" steuern (http://xhtmlforum.de/showthread.php?t=74120)

hatschiii 24.07.2020 10:45

Shortcode "individuell" steuern
 
Ich habe folgenden Code:

Code:

<div class="shariff-single" style="display:flex;justify-content: center;align-items: center"><?php echo do_shortcode("[shariff]"); ?></div>

Nun gibt dieser Shortcode im <li> ellement eine marging-left: 1px; und margin-right: 1px aus. Dies ist auch gut so. An anderer Stelle möchte ich aber den gleichen Shortcode ausgeben allerdings mit links und rechts einer margin von 6px.

Kann ich das über das div style steuern oder muss ich um das php echhe einen Span setzen? ...oder lieg ich hier ganz falsch und ich muss das anders machen?

protonenbeschleuniger 24.07.2020 11:19

Zitat:

Zitat von hatschiii (Beitrag 554326)
Nun gibt dieser Shortcode im <li> ellement eine marging-left: 1px; und margin-right: 1px aus.

Wo? In deinem Beispiel ist davon nichts zu sehen.

hatschiii 24.07.2020 11:30

Es geht doch nur darum ob ich in dem Code oben irgenwie die li margin des shortcodes überschreiben kann... Die li class anpassen würde den Abstand überall ändern, ich will ihn aber individuell unterschiedlich and unterschiedlichen Stellen auf der Site haben.

...aber gut, hier der ganze Queellcode:

https://dlgo.de/24-07-_2020_10-28-29.jpg

Sailor56 24.07.2020 11:31

Was macht denn dieser Shortcode?
Wäre hilfreich, wenn du den ausgelieferten HTML Code posten würdest und nicht den Shortcode, von dem außer dir niemand weiß, was da rauskommen soll.

hatschiii 24.07.2020 11:35

Du siehst in dem Sccreen den blauen Balken. Setze den gedanklich 3 Zeilen nach oben, dann ist alles was drunter kommt vom Shoortcode ausgegeben (und soll auch so bleiben)

hatschiii 24.07.2020 11:38

Unabhängig von meiner Site... Wie kann ich in einem <span> </span> die margin für list elemente angeben so, dass diese margin nur für alles innerhalb des span gilt (und andere margins überschreibt)

Sailor56 24.07.2020 11:39

... meine Antwort hat sich mit deiner überschnitten.

Versuche mal folgendes...
Gebe dem div, bei dem du das größere margin haben willst eine zusätzliche Klasse (class)
Code:

<div class="shariff-single margin-breit" style="display:flex;justify-content: center;align-items: center"><?php echo do_shortcode("[shariff]"); ?></div>
dann in das 'zusätzliche CSS' den Code
Code:

.shariff-single.margin-breit li {
  margin-left: 6px;
  margin-right: 6px;
}


hatschiii 24.07.2020 11:45

oh man... logisch, ganz einfach :)

...aber leider hakt es noch irgendwo :(

Hier am Ende des Artikels sind die blauen Icons um die es geht:

https://esser.me/why-digitalization-...ransformation/

Sailor56 24.07.2020 12:08

Sieht so aus, als würden hier andere CSS Formate sich gegenseitig beeinflussen/überschreiben - hatte ich glaube ich schon mal erwähnt - Thema Fleißarbeit!
Hier hilft dann nur der 'unschöne' Holzhammer mit !important.
Code:

.shariff-single.margin-breit li {
  margin-left: 6px !important;
  margin-right: 6px !important;
}


protonenbeschleuniger 24.07.2020 12:15

Ist das nicht exakt das gleiche worum es hier ging?
https://xhtmlforum.de/74118-dynamischer-abstand.html

Wenn man sich das CSS genauer anschaut hat auch der inline Code ein !important. Das zählt mehr.

hatschiii 24.07.2020 12:21

Bei dem Link ging es um die Icons in der rechten sidebar... da ist der Abstand dynamisch und min 1px. Unter dem Artikel soll er halt Fix sein, deshalb habe ich einen neuen Thread aufgemacht.

!important versuche ich gleich mal :) DANKE !!!

hatschiii 24.07.2020 12:23

Zitat:

Zitat von Sailor56 (Beitrag 554335)
Sieht so aus, als würden hier andere CSS Formate sich gegenseitig beeinflussen/überschreiben - hatte ich glaube ich schon mal erwähnt - Thema Fleißarbeit!
Hier hilft dann nur der 'unschöne' Holzhammer mit !important.
Code:

.shariff-single.margin-breit li {
  margin-left: 6px !important;
  margin-right: 6px !important;
}



JUHUUU!!! Es funzt... 1000 Dank :)


Alle Zeitangaben in WEZ +2. Es ist jetzt 17:57 Uhr.

Powered by vBulletin® Version 3.8.11 (Deutsch)
Copyright ©2000 - 2024, vBulletin Solutions, Inc.

© Dirk H. 2003 - 2023