Ich versuche, einen Text in einem <li>-Element mit CSS durch Einstellung text-indent: -999px; zu verbergen.
Aus irgendeinem Grund funktioniert dies nicht, wenn ich die Richtung des Dokuments auf "rtl" (von rechts nach links - meine Website ist in Hebräisch) festlegen.
Wenn die Richtung "rtl" ist, zeigt der Text immer noch ...
Wer weiß warum, und ein Weg um dies?Verstecken von Text mit "Text-Einzug"
Die text-indent: -99px ist ein alter Trick, der nicht der optimale Weg ist, um Text zu verstecken. Warum nicht stattdessen visibility:hidden verwenden?
Vermutlich ist dies der Versuch, ein ** Hintergrund ** -Bild als Inhalt zu verwenden und echten Text für Bildschirmleseprogramme bereitzustellen, anstatt ein '' -Element mit einem 'alt'-Attribut zu verwenden. –
Quentin
ich kann Sichtbarkeit nicht verwenden: versteckt, weil ich nur den Text brauche, um wegzugehen. nicht das ganze Element, in dem der Text platziert wird. jede Lösung? – Crippletoe
auch, ich benutze dort ein Hintergrundbild. ganz richtig! – Crippletoe
Sie können Zeilenhöhe verwenden, die einen großen Wert angibt, z. B. 100px für einen 30px hohen Container.
funktioniert nur, wenn Ihr Container in der Größe begrenzt ist. Möglicherweise müssen Sie die Höhe speziell festlegen, wenn dies noch nicht geschehen ist.
Was ist mit der Einstellung direction:ltr auf die Elemente, die Sie versuchen, negative text-indent zu geben?
+1 das ist die richtige Antwort - funktioniert und ändert nur eine Eigenschaft, die irrelevant ist (da der Text versteckt wird) – ori
Zusammen mit text-indent: -9999px versuchen display: block; verwenden. Es hat für mich gelöst.
Wenn Sie die li-Elemente horizontal schweben lassen möchten (z. B. ein horizontales Menü), verwenden Sie float: left;.
Versuchen Sie, die Textausrichtung so einzustellen, dass sie der Richtung entspricht, in die Sie den Text einrücken.
Wenn Sie beispielsweise LTR verwenden und Text negativ einrücken möchten, sollten Sie neben dem Hinzufügen von display: block auch die linke Ausrichtung hinzufügen.
Nicht sicher für RTL, aber scheint logisch, Sie sollten es positiv einrücken und richtige Ausrichtung verwenden.
Ich fand der beste Weg, um den Text, um eine transparente Farbe zu machen ist:
Farbe: rgba (0,0,0,0);
Hinweis: noch Dieser Fehler in Firefox existiert 12 (text-indent Wert wird auf rtl ignoriert)
text-align: right; funktioniert bei mir
color: transparent;
oder
font-size:0px;
Ich ziehe diese Lösung:
.hide_text { text-indent: 100%; white-space: nowrap; overflow: hidden; }
Mein Problem mit text-align war. Wenn Sie den Ausrichtungsmodus des Elements oder des übergeordneten Elements ändern, das es nach links einschließt, müssen Sie einen negativen Index für den Texteinzug angeben. Ansonsten müssen Sie einen positiven Wert angeben.
.case1{text-indent:-999px;text-align:left;overflow:hidden;display:block}
Ansonsten
.case2{text-indent:999px;text-align:right;overflow:hidden;display:block}
Hinweis: Ich glaube, dass das nicht in IE6 funktioniert. + http://www.456bereastreet.com/archive/200510/google_seo_and_using_css_to_hide_text/ – aviraldg
könntest du padding/overflow: versteckt um deinen Inhalt zu verstecken, funktioniert das in jedem Browser und in jeder Textrichtung. so:'Breite: 0; Höhe: 0; Auffüllen: 400px 0 0 200px; Überlauf: Versteckt ' – meo
Wenn Sie keine gute Lösung bekommen, können Sie immer andere Textverschleierungstechniken ausprobieren: D http://css-tricks.com/css-image-replacement/ –