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

Can't Fix Recent Rtl/Lts fix caused unwanted alignment issues.

Discussion in 'Resolved Bug Reports' started by Moddis, Feb 6, 2015.

  1. Moddis

    Moddis Active Member

    The recent addition in in xenforo.css caused unwanted alignment issues is one of custom style installation.

    Code:
    [dir=auto] { rtl-raw.text-align: {xen:if $pageIsRtl, right, left}; }
    That line inserted a "text-align:left" for a block that was supposed to be centered aligned due to its parent(if you have the ".messageUserBlock h3.userText" centered, you would see the issue in latest update). Of course I can now add my own style to each of the children(e.g. ".username") and force them to center align, but that takes a lot of customization since changes also need to me made to different @media sizes as well.

    I did further research and noticed that auto attribute is only recommended if the text direction is truly unknown. Since XenForo always knows which direction the text is meant to be read from based on the setting "$pageIsRtl" (located in your Language options), wouldn't it make sense to specify the direction based on the user setting instead of just using "auto"? Like so:

    Code:
    [dir={xen:if $pageIsRtl, rtl, ltr}] { rtl-raw.text-align: {xen:if $pageIsRtl, right, left}; }
    When I manually made the change above and tested the layout using the left-to-right and right-to-left Text Direction setting, all worked great and I didn't notice any inconveniences alignment issues.
     
  2. Mike

    Mike XenForo Developer Staff Member

    Just to clarify that this isn't the case and it's why the code was added. It's significant if a username is written using Latin characters on an otherwise RTL page or Arabic characters on an otherwise LTR page. dir=auto lets the browser control how the block gets laid out based on how it begins.
     
  3. Mike

    Mike XenForo Developer Staff Member

  4. Moddis

    Moddis Active Member

    Ah, thanks for explaining. I was actually looking for the post with reason why this was added so I know what other things my changes could affect. I guess it does get a little (lot) confusing if its a multi-language forum.

    Maybe you can consider making "Multi-Language" an option in Language so that you can be sure no Ltr/Rtl settings affect the Ltr-only forums and allow you to be more aggressive when making Rtl only customization.
     
  5. Mike

    Mike XenForo Developer Staff Member

    It's not actually RTL-specific. It happens in any situation where the opposite text direction gets mixed in. This is how Firefox renders without the fix:

    upload_2015-2-11_11-23-46.png

    I think it's probably best that you add code to handle this for your needs. The easiest thing would be to add center alignment to ".messageUserBlock a.username" directly. Alternatively, you can add "inherit" alignment, provided you are explicitly setting an alignment on a parent element. (If you don't, it just undoes the fix.)
     

Share This Page