Feature boxes

The boxes on our add-ons page use quite a bit of custom CSS to achieve the look - you're welcome to use the inspect element tool in your browser to take the CSS and get a similar look.

I would suggest a plugin like this to create columns: https://wordpress.org/plugins/lightweight-grid-columns/

Let me know if you need more info :)

Thanks Tom

You're welcome :)

Hi Tom,

How do you best recommend to style the columns created using the lightweight grid plugin please?

E.g. if you wanted 3 yellow columns side by side - with a gap between each

Thanks

You can give the columns a class, for example: http://screencast.com/t/q2b2OWBG

Then add the CSS:

.my-columns {
    padding: 10px;
    margin-right: 10px;
    background-color: yellow;
}

If you want to add a border:

.my-columns {
    padding: 10px;
    border: 1px solid #DDD;
}

How can made some height to three box?
I use equal_heights="true" in this example but the result is wrong
https://cheariatira.altervista.org/home/

Hi there,

the columns themselves are the same height - but this doesn't control the height of the content within. If you want to force the buttons to the bottom of the column you could add this CSS:

.inside-grid-column {
    display: flex;
    flex-direction: column;
    height: 100%;
}

.inside-grid-column p:nth-of-type(1) {
    margin-bottom: auto !important;
}

Thanks it work!(with a blank row...)

You're welcome