je nach Float ein anderes Margin setzen?

NetBull

Erfahrenes Mitglied
Hi,

ich hab ein CMS (Joomla!) mit eigener Ausgabe der Komponenten. So habe ich Text der rechts oder links von floatenden Bildern ausgegeben wird. Nun möchte ich das bei IMG mit einem float: left das margin-right: auf 5px gesetzt wird und bei float: right das margin-left auf 5px. Geht das ? Wie?

cu NetBu||
 
Da die Grafikelemente wohl schon eine spezifische Klasse besitzen (bspw. .floatLeft und .floatRight), könnte ihnen eine weitere Klasse mit dem zugehörigen Außenabstand zugewiesen werden:
CSS:
.marginRight {margin-right:5px}
.marginLeft {margin-left:5px}
HTML:
<img class="floatLeft marginRight" .../>
<img class="floatRight marginLeft" .../>
Oder es werden die Regeln direkt in zwei Klassen vereint:
CSS:
.imgFloatLeft {float:left;margin-right:5px}
.imgFloatRight {float:right;margin-left:5px}
HTML:
<img class="imgFloatLeft" .../>
<img class="imgFloatRight" .../>
 
leider besitzen die Elemente keine solche Klasse. Ich habe gehofft es gibt eine reine CSS Lösung, die Elementen mit bestimmten Werten wiederum bestimmte Werte zu weist..
 
das wird im BackEnd des CMS eingestellt (da kann man hardcodiert noch ein Margin setzen.)
Ich vermute mal das mein Wunsch gar nicht umsetzbar ist ohne den Code der die HTML Elemente parsed zu ändern, oder?
 
hätte ja sein können. Im Backend kann ich noch ne klasse setzen, aber das hat nebeneffekte, ... glaub ich mach das immer per hand... (nur wenn andere dran arbeiten die keine ahnung von CSS/HTML haben, wird es häslich....)
 
Hallo,
selbst wenn das im Backend eingestellt wird wird der CSS-Wert ja irgendwie an das Element übergeben.
Entweder über eine Klasse oder über ein Inline-styling.
Diese Ausgabe kannst du eigentlich auch überprüfen und dann entsprechend einen weiteren Wert setzen.

Um welche Komponente handelt es sich denn?

Grüße
 
Wenn float der einzige inline-style ist, könntest du mit Attribut-Selector arbeiten:
CSS:
p[style="float: left;"] {
margin-left: 5px;
}
Aber 1. ist es ganz und gar nicht sauber und 2. sobald da ein weiterer Inline-Style hinzukommt funktioniert es nicht mehr.

Besser wäre
Im Backend kann ich noch ne klasse setzen, aber das hat nebeneffekte
da eine eigene Klasse zu erstellen und bei dieser sowohl float als auch margin setzen
 
Zurück