Tinymce und Klassen

[affe]

Hallo,

Ich nutze Tinymce und möchte damit texte klassifizieren.
Ich habe tinymce schon soweit umprogrammiert, dass ich meine Klassen über das DropDown-Menü "--Styles--" auswählen kann.

Aber Tinymce ist zu doof!

Angenommen wir haben diesen Text:
asdfasdfasdf
asdfasdfasdf

Wenn ich nur eine Textzeile doppelt anklicke und dann den Style auswähle macht er folgenden HTML-Code draus:
<p class="style_small">asdfasdfasdfasdf</p>
Soweit so gut!

Ich kann den Text aber auch vom Ende bis zu Anfang markieren. Dann passiert folgendes:
<p class="style_small">asdfasdfasdf</p><p><span class="style_small">asdfasdfasdfasdf </span></p>

Plötzlich findet sich da ein <SPAN> was noch besser ist wie der <P>-Tag.
Warum ist das besser?: Meine Klasse die ich dazu benutze ist folgende:

width: 0px;
background-color: #fff;
filter:alpha(opacity=50);
opacity: 0.5;
-moz-opacity:0.5;
padding: 4px;
font-size: 10px;

Wenn <SPAN> Die klasse annimmt macht der Browser genau das was er soll.
Der Text wird mit einem halbtransparentem Hintergrund hinterlegt mit padding: 4px;
Leider muss ich width: 0px; als Trick angeben damit der Text-Hintergrund von anfang bis Ende geht und nicht weiter oder kürzer ist wie der text selbst.
Im Firefox ist das aber genau das Problem:
<p class="style_small"> hinterlegt diesen Text-Hintergrund nur für etwa 5px breite und der rest bleibt normaler text!

Um Das Problem einfacher zu verstehen kopiert den nachfolgenden HTML-text hier rein http://www.w3schools.com/TAGS/tryit.asp?filename=tryhtml_span

----

<style type="text/css">
<!--
body {
background-color: green;
}

.style_small {

width: 0px;
 background-color: #fff;

filter:alpha(opacity=50);
 opacity: 0.5;
 -moz-opacity:0.5;

padding: 4px;

font-size: 10px;
}
-->
</style>

<p class="style_small">asdfasdfasdf</p>
<p><span class="style_small">asdfasdfasdfasdf </span></p>

----

wie gesagt ein mal im IE und einmal im FF anschauen.
Dazu empfehle ich für den Firefox das Add-On: "IE-Tab"!

Frage:
Wie bekomme ich es hin das der FF das selbe macht wie der IE oder der P-Tag das selbe macht wie der SPAN-Tag?

Danke!

[Harlequin]

Yerf!

Leider muss ich width: 0px; als Trick angeben damit der Text-Hintergrund von anfang bis Ende geht und nicht weiter oder kürzer ist wie der text selbst.

Für welchen Browser? Span ist inline und somit hat eine width-Angabe keine Auswirkung. Eine Ausnahme dürfte die IE-Eigenheit hasLayout sein, die kann man aber auch über andere Angaben triggern (zoom:1 z.B.)

Im Firefox ist das aber genau das Problem:
<p class="style_small"> hinterlegt diesen Text-Hintergrund nur für etwa 5px breite und der rest bleibt normaler text!

Klar (zumindest fast, ich würde 8px erwarten). Du hast dem Absatz ja gesagt, er soll 0px breit sein (der IE kapiert das blos nicht).

Wie bekomme ich es hin das der FF das selbe macht wie der IE oder der P-Tag das selbe macht wie der SPAN-Tag?

display:inline für den Absatz, alleridngs is das nicht wirklich empfehlenswert, da es am Sinn eines Absatzes vorbeigeht. Du willst an der Stelle sicherlich ein Span verwenden.

Ich würde erst mal nach dem Auslöser für das Hintergrund-Problem suchen, damit du die seltsame Width-Angabe nicht mehr brauchst.

Gruß,

Harlequin