Support Forums

Support Forums Forums Search & Filter Pro How to Align Range Text Upper Limit to Right

This topic is: resolved
Viewing 8 posts - 1 through 8 (of 8 total)
  • Jin Hoe Lian
    #250609

    Hi,

    I would like to know how to style the range text upper limit to right.

    Example from this:
    https://prntscr.com/t90it1

    To this:
    https://prntscr.com/t90itc

    Thanks.

    Trevor Moderator
    #250653

    Are you able to send me a live link/URL to your search page so I can take a look?

    Jin Hoe Lian
    #250658

    Unfortunately, I’m running this locally now. Is there anything else I can provide? Paste the code?

    Trevor Moderator
    #250660

    OK, you need to do two things.

    Set the field to have a max-width, something like this:

    .sf-field-post-meta-edd_price {
      max-width: 235px;
    }

    You will need the actual class name for the li element in the form, mine is just an example.

    Then this CSS to move the value over:

    .sf-range-max {
      float: right;
    }
    Jin Hoe Lian
    #250681

    Wow, almost there. The dollar sign prefix is still stuck in front.
    https://prntscr.com/t97g8b

    I tried adding sf-range-prefix but both $ prefix flew to the right.
    https://prntscr.com/t97jk2

    Any solution?

    Trevor Moderator
    #250687

    Try having no prefix, and use this CSS:

    .sf-text-number:before {
      content: "$";
    }
    Jin Hoe Lian
    #250698

    Thank you so much! Problem solved!

    Trevor Moderator
    #250704

    Thanks for letting me know. I will close this thread for now.

Viewing 8 posts - 1 through 8 (of 8 total)

The topic ‘How to Align Range Text Upper Limit to Right’ is closed to new replies.