Die X-Achse der Seite ist vermasselt, weil sie auf Hebräisch ist

Eine der Websites meines Kunden ist auf Hebräisch, eine Sprache von rechts nach links.

Ich benutze das MH Newdesk Lite-Theme auf wordpress.org . Das Theme verwendet eine von core wordpress generierte class .screen-reader-text{} , um das Suchformular mit get_search_form() .

Das Problem ist, dass Text, speziell “חפס”, über die Seite auf der linken Seite fließt. Ich glaube, das liegt daran, dass es in RTL-Sprache angezeigt wird. Ich will es so machen, dass die Homepage (und evtl. auch einige der anderen Seiten und Beiträge), nie auf die X-Achse scrollt. Was ist die beste Vorgehensweise für Theme-Entwickler und Benutzer dieses Themas, .screen-reader-text{} während die Barrierefreiheit erhalten .screen-reader-text{} und die Anzeige nicht durcheinander gebracht wird (wie die Seite in meinem Fall horizontal .screen-reader-text{} )?

Hier sind einige Links, die ich gefunden habe, die relevant sind: https://make.wordpress.org/accessibility/tag/screen-reader/ https://make.wordpress.org/themes/2015/01/26/supporting- Bildschirmleser-Text /

Solutions Collecting From Web of "Die X-Achse der Seite ist vermasselt, weil sie auf Hebräisch ist"

Es ist wegen CSS:

Überprüfen Sie dies (Zeile # 314 style.css):

 .search-form .screen-reader-text { left: -9999px; overflow: hidden; position: absolute; } 

Entfernen Sie den linken Rand, dann funktioniert es gut. Es ist in der Seitenleiste Suchformular. Entschuldigung für Englisch.

Vielen Dank

Kontext: Zugänglichkeitsanleitung sagt, dass Formulare Labels haben sollten. Der Designdesigner entschied offensichtlich, dass sie das Label nicht dort haben wollten, aber den CSS-Trick benutzten, um es zu bewegen, ohne die Anleitung völlig zu missachten.

Dieser Code verbirgt jedoch nur die Suchformularbezeichnung links von einer Seite in Englisch (oder einer anderen Sprache von links nach rechts). Da Hebräisch von rechts nach links ist, erscheint der Text und macht die Seite wirklich breit.

Die schnelle Lösung besteht darin, sie nach rechts anstatt nach links zu verstecken. @ Vee’s Antwort bringt die Textbeschriftung neben das Formular zurück, wenn du es dort möchtest.

Sie werden möglicherweise abgelehnt, weil jemand denkt, Sie stellen die falsche Frage, oder Sie haben es nicht richtig recherchiert , oder etwas anderes.

@ Vee’s Methode wird funktionieren, aber wenn Sie es von der Anzeige verborgen halten möchten, verwenden Sie diese Methode:

 .search-form .screen-reader-text { overflow: hidden; clip: rect(1px, 1px, 1px, 1px); position: absolute !important; height: 1px; width: 1px; } 

Es sieht so aus, als ob du ein Jetpack Custom CSS Plugin installiert hast, also füge es einfach hinzu, dann musst du dich nicht mit dem übergeordneten Thema herumschlagen.