Need to create a styled area to place Essential Grid shortcodes in

Hi, I am using essential grid to present animals in an animal rescue centre. In order to filter through the animals I have used shortcode which shows the 4 category filters. What i need to achieve is to get these shortcodes wrapped in a losenge like the grid below and centre the filters (see screen grab). can you take a look at some code that i can drop into the page and some css to start me off please?

I have opened the back end up if you want to take a look.

Thanks for your great work in advance.


  • Kasia Swiderska
    • Support nomad

    Hello Studio3creative,

    I have opened the back end up if you want to take a look.

    I'm afraid you opened access to different side.

    But if filters are generated by one shortcode you can wrap this shortcode with div like this

    <div class="filtersForGrid">
    [your shortcode]

    and then in CSS add

    .filtersForGrid {    border-style: dotted;
        border-color: #e6e7e8;
        border-width: 7px;

    kind regards,

Thank NAME, for their help.

Let NAME know exactly why they deserved these points.

Gift a custom amount of points.