Navigation
Archive / Making Essential Grid Same Height for all products
This is archived content. Visit our new forum.

Tagged: 

  • Author
    Posts
  • July 9, 2016 at 11:59 am #1079426
    atg85
    Participant

    Hi X! Nearing completion work for http://mercurius.ca/v/

    If you scroll down a bit you’ll see a listing of products – It’s looking very nice but as you can see some names are longer (2-3 lines of text) than others and it throws the cleanness out of whack – I’d like to force everything to be even – I can’t seem to do it with the UI of Ess Grid but is there a CSS trick that could help?

    Thank you!

    July 9, 2016 at 9:57 pm #1079820
    Rue Nel
    Moderator

    Hello There,

    Thanks for writing in! The height moves and it is not uniform because your titles are not of the same word length. To be able to control the height of each grid, we need to place a minimum height of the title. Please add the following css code in the customizer, Appearance > Customize > Custom > CSS

    .esg-entry-content .esg-content a {
    min-height: 36px;
}

    We would loved to know if this has work for you. Thank you.

    July 10, 2016 at 9:57 am #1080213
    atg85
    Participant

    Hi Rue!

    Thank you for the help! That did the trick for me!

    .esg-entry-content .esg-content a {
    min-height: 55px;
}

    I also had to adjust the button’s top padding to 15px in the Essential Grid Skin Editor to make sure all lined up well. Thanks so much for your help 🙂

    July 10, 2016 at 11:00 am #1080277
    Rupok
    Member

    You are welcome!

    Glad that it helped. Feel free to let us know if you face any other issue. We’ll be happy to assist you.

    Thanks for using X.

    Cheers!

  • Author
    Posts
  • <script> jQuery(function($){ $("#no-reply-1079426 .bbp-template-notice, .bbp-no-topic .bbp-template-notice").removeClass('bbp-template-notice'); }); </script>