1. This site uses cookies. By continuing to use this site, you are agreeing to our use of cookies. Learn More.

Fixed RTL Layout Issue In Old IE

Discussion in 'Resolved Bug Reports' started by ibnesayeed, Jan 5, 2012.

  1. ibnesayeed

    ibnesayeed Well-Known Member

    Some of our forum members are forced to use old IE browser in their office. They complain about the serious layout float issues on our RTL forum. A screen shot is attached below.

    One can easily observe long horizontal scroll bar. Navigation tabs, Inbox, Alert and other stuff on that bar is floated somewhere far away from the stage. Similarly, post author icon and other user info is floated to left. This problem was reported to us long back but we don't get a solution ourselves yet. Hence reporting here.

    [​IMG]
     
  2. Vincent

    Vincent Well-Known Member

    Old IE as in 6, 7, 8? Or even lower? :eek:
     
    ibnesayeed likes this.
  3. ibnesayeed

    ibnesayeed Well-Known Member

    Obvious question! :)

    Those guys were not very technical to answer this question. Looking at screenshot above, it is not IE6 at least because of the UI look and feel and tabbed browsing etc. :)
     
  4. ibnesayeed

    ibnesayeed Well-Known Member

    I have experimented it myself in IE9. Everything looks good in normal mode but if I click on "compatibility mode" icon, result is almost the same as screenshot above. :)
     
    Vincent likes this.
  5. mrGTB

    mrGTB Well-Known Member

    Looks like either IE 7 or 8 to me, it's not IE6 because it doesn't use Tabs
     
    ibnesayeed likes this.
  6. ibnesayeed

    ibnesayeed Well-Known Member

    Even the later version of IE (namely IE9) shows the same issue in compatibility mode. :)
     
  7. ibnesayeed

    ibnesayeed Well-Known Member

    How to replicate:

    Go to XenForo Demo site and create a demo.
    Login to Admin Control Panel and create a new language in Right-to-Left direction. (Or change the default language settings to make it RTL)
    Open public demo site in any version of IE and select the RTL language. If browser is old then you should not see rounded corners and you may see missing navigation tabs. You may also see a horizontal scroll bar at the bottom.
    If you have newer version of IE, things should appear OK but the moment you click on compatibility mode icon, rounded corners and navigation tabs will be gone and horizontal scroll bar will appear.

    I have created such a demo already. You may experience before it expires. To experience the issue, open it in IE and select the "Arabic RTL" language from footer if not selected already.
     
  8. Mike

    Mike XenForo Developer Staff Member

    I haven't seen the avatar thing, but I've been focused on the navigation issue. I can confirm it happens, and thus far I've been totally unable to workaround it. It's triggered if you have a float: right element inside a float: right element:
    HTML:
    <!DOCTYPE html>
    <html dir="rtl">
    <head>
     
        <meta charset="utf-8" />
        <style type="text/css">
            div { background: lightgrey; border: 1px solid red; overflow: hidden; zoom: 1; margin-bottom: 10px; }
            ul { background: grey; border: 1px solid yellow; list-style-type: none; margin: 5px; padding: 0; overflow: hidden; float: right; }
            ul.left { float: left; }
            li { background: black; color: white; border: 1px solid orange; padding: 5px; margin: 5px; float: right;}
        </style>
    </head>
    <body>
     
    <div>
    <ul>
        <li><a>test 2</a></li>
        <li><a>test test test 3</a></li>
        <li><a>test 4</a></li>
    </ul>
    <ul class="left">
        <li><a>test 2</a></li>
        <li><a>test test test 3</a></li>
        <li><a>test 4</a></li>
    </ul>
    </div>
     
    </body>
     
    ibnesayeed likes this.
  9. Mike

    Mike XenForo Developer Staff Member

    And I've finally found a workaround - there were a few other places that had issues with it too.

    I can't reproduce the avatar thing, and it's possible that some of the other changes have fixed it. Please let me know if you still have an issue in 1.1.2.
     
    ibnesayeed likes this.
  10. ibnesayeed

    ibnesayeed Well-Known Member

    And just to make sure, I did not miss 1.1.2 release yet, right? :)
     
  11. Brogan

    Brogan XenForo Moderator Staff Member

    Correct, the current version is 1.1.1.
     
    ibnesayeed likes this.

Share This Page