[wp-trac] [WordPress Trac] #36183: Twenty Fourteen: Incompatibility with Right-To-Left (RTL) webpages AND the default video player (was: Incompatibility of Twenty Fourteen with Right-To-Left (RTL) webpages AND the default video player)

[WordPress Trac]

#36183: Twenty Fourteen: Incompatibility with Right-To-Left (RTL) webpages AND the
default video player
---------------------------+------------------------------
 Reporter:  samerafach     |       Owner:
     Type:  defect (bug)   |      Status:  new
 Priority:  normal         |   Milestone:  Awaiting Review
Component:  Bundled Theme  |     Version:  4.4.2
 Severity:  normal         |  Resolution:
 Keywords:                 |     Focuses:  ui, rtl
---------------------------+------------------------------
Changes (by SergeyBiryukov):

 * focuses:   => ui, rtl
 * component:  Formatting => Bundled Theme


Old description:

> First problem: There's a horrible bug in the Wordpress theme-foundation
> (Not only the Twenty-Fourteen theme that I currently use) that affects
> all objects that depend on the orientation, including drop-down menus.
> For example, in this page:
>
> http://link.afach.de/rtlproblem
>
> Apparently the menus are hidden to the fore-left, and then appear as
> drop-down when one hovers on them. Now the problem is that they really
> show up on the fore-left, creating an infinitely long horizontal scroll-
> bar. In the webpage, I fixed this problem using the CSS Tags:
>
>     .primary-navigation ul ul, .primary-navigation ul ul ul {
>         left:auto;
>         right: -999em;
>     }
>
>     .primary-navigation ul li:hover > ul, .primary-navigation ul li.focus
> > ul {
>         right: auto;
>     }
>
> which I got from an expert on Stackoverflow after this problem drove me
> really crazy because I, myself, am not a CSS expert. Anyway, please visit
> that page, and remove these tags, and see how the menus will appear,
> creating a very long horizontal scroll-bar that ruins the page.
>
> Second problem: The same problem also exists with the default Wordpress
> video player. Without the following tag:
>
>     .mejs-offscreen{
>         right: -10000px;
>         left: auto;
>     }
>
> the video-player will also create a very long horizontal scroll bar.
> Please try to remove it from the page and see for yourself.
>
> Thank you for the great platform, Wordpress. I love it!

New description:

 First problem: There's a horrible bug in the Wordpress theme-foundation
 (Not only the Twenty-Fourteen theme that I currently use) that affects all
 objects that depend on the orientation, including drop-down menus. For
 example, in this page:

 http://link.afach.de/rtlproblem

 Apparently the menus are hidden to the fore-left, and then appear as drop-
 down when one hovers on them. Now the problem is that they really show up
 on the fore-left, creating an infinitely long horizontal scroll-bar. In
 the webpage, I fixed this problem using the CSS Tags:
 {{{
     .primary-navigation ul ul, .primary-navigation ul ul ul {
         left:auto;
         right: -999em;
     }

     .primary-navigation ul li:hover > ul, .primary-navigation ul li.focus
 > ul {
         right: auto;
     }
 }}}
 which I got from an expert on Stackoverflow after this problem drove me
 really crazy because I, myself, am not a CSS expert. Anyway, please visit
 that page, and remove these tags, and see how the menus will appear,
 creating a very long horizontal scroll-bar that ruins the page.

 Second problem: The same problem also exists with the default Wordpress
 video player. Without the following tag:
 {{{
     .mejs-offscreen{
         right: -10000px;
         left: auto;
     }
 }}}
 the video-player will also create a very long horizontal scroll bar.
 Please try to remove it from the page and see for yourself.

 Thank you for the great platform, Wordpress. I love it!

--

--
Ticket URL: <https://core.trac.wordpress.org/ticket/36183#comment:1>
WordPress Trac <https://core.trac.wordpress.org/>
WordPress publishing platform