[wp-trac] [WordPress Trac] #13643: [twentyten] CSS RTL conflict with "Skip to content" accessibility link

[WordPress Trac]

#13643: [twentyten] CSS RTL conflict with "Skip to content" accessibility link
--------------------------+-------------------------------------------------
 Reporter:  Ornani        |       Owner:                   
     Type:  defect (bug)  |      Status:  new              
 Priority:  normal        |   Milestone:  3.0              
Component:  General       |     Version:  3.0              
 Severity:  normal        |    Keywords:  rtl,twentyten,css
--------------------------+-------------------------------------------------
 While developing a twentyten child theme in Hebrew, I encountered this
 bug.

 When a language such as Hebrew that is written from right to left is used
 in WordPress, it automatically links to the theme's rtl.css file if
 available.

 In the current twentyten theme, the rtl.css file makes the "Skip to
 content" link clickable.

 From twentyten's rtl.css:
 {{{
 /* Text meant only for screen readers */
 .screen-reader-text {
         left: auto;
         text-indent:-9000px;
         overflow:hidden;
 }
 }}}

 This "left: auto" property overrides the style.css left property.

 From twentyten's style.css:
 {{{
 /* Text meant only for screen readers */
 .screen-reader-text {
         position: absolute;
         left: -9000px;
 }
 }}}

 The link is there and it is clickable but there is no text thanks to the
 text-indent and overflow properties.

 Mouseover screenshot:
 http://i50.tinypic.com/25gugk2.jpg

 Google chromes inspect element (Chrome's firebug equivalent):
 http://i49.tinypic.com/28bsknr.jpg

 You can easily reproduce this problem by installing a fresh WP3-RC1, then
 copying he_IL's language files to wp-content/languages, and editing the
 WPLANG in wp-config to "he_IL".

 Solution - delete the following lines from rtl.css:
 {{{
 /* Text meant only for screen readers */
 .screen-reader-text {
         left: auto;
         text-indent:-9000px;
         overflow:hidden;
 }
 }}}

-- 
Ticket URL: <http://core.trac.wordpress.org/ticket/13643>
WordPress Trac <http://core.trac.wordpress.org/>
WordPress blogging software