Viewing 10 posts - 1 through 10 (of 10 total)
  • Author
    Posts
  • #475474

    Hi,

    I love the Enfold theme, and I am using the Portfolio Grid to display my work portfolio. I would like to have the sortable categories display in 3 columns rather than as a list with the “/” separator. Is this possible?

    Thank you

    #475730

    Hey Betsy!

    Thank you for using Enfold.

    You can try this in the Quick CSS field:

    #js_sort_items a {
      width: 32%;
      margin-left: 1%;
    }
    
    #js_sort_items .text-sep {
      display: none;
    }

    Regards,
    Ismael

    #482915

    Hi Ismael,

    Thanks for the quick update. This fix does work well on desktop, but it is causing spacing issues on mobile. I can send a screenshot, or you can visit the page provided. Please let me know if you have any further suggestions.

    Thank you,
    Betsy

    #482993

    Hi!

    Please do upload a screenshot, so we can see how it does look.

    Regards,
    Basilis

    #485715

    How do I upload a screenshot to this thread?

    Thank you!

    #485846

    Hi,

    You can upload to for instance imgur.com or a public dropbox folder and then link to them here.

    Cheers!
    Rikard

    #495161

    I have added the link to the Dropbox image.

    Thank you,
    Betsy

    #495769

    Hey!

    and what do you want to change? we need to see the result you want to achieve, because then we can provide you some precise CSS code.

    Best regards,
    Andy

    #502176

    Hi,
    I have attached a link to the screenshot outlining the results I would like to achieve. The boxes indicate areas with awkward spacing. The categories are listing in a meaningful order, and I do not want to adjust the order. I would like the categories to be evenly spaced and to eliminate the excess white space between the categories and the content (also noted in the screenshot).

    Thank you,
    Betsy

    • This reply was modified 9 years ago by AMBetsy.
    #502441

    Hey!

    Replace the previous code with this:

    @media only screen and (min-width: 768px) {
    #js_sort_items a {
      width: 32%;
      margin-left: 1%;
    }
    
    #js_sort_items .text-sep {
      display: none;
    }
    }

    It will only affect the desktop view. The sort items are not created to work as columns so you will need to use the default layout on mobile view.

    Best regards,
    Ismael

Viewing 10 posts - 1 through 10 (of 10 total)
  • You must be logged in to reply to this topic.