Atmosphere: three column widget in the footer (responsive too) and height

[kchopan]

Hi! It´s the first time I use this forum. I am working with the atmosphere theme and I would like to have three columns in the footer widget (in the orange section); I would like it to be responsive too (look fine in smartphones). Finally, I would like to decrease the footer height a bit (it´s too large in my opinion).

Thanks a lot!!

https://www.electrocuencarenovables.es

[askdesign]

It looks like you figured out how to get the 3 columns.

To make the footer widgets responsive, you need to modify your media queries. Around the 780px width, that area begins to look crowded. You might have a media query for 780px already in the CSS. If so, add to it the following code to it. If not, create a new media query, like so:

/* iPhones (portrait and landscape) --------------------------------------------- */

@media only screen and (max-width: 768px) {

/* --- CSS part begins --- */
.footer-widgets .widget {
    float: none;
    margin: 0 auto /* --- to center the blocks --- */
    width: 100%;
}

/* --- CSS part ends --- */
}
/* --- media query ends --- */

To decrease the footer height, modify the CSS:

.footer-widgets {
    padding: 20px 20px;
}

---

Anne S. Katzeff
Designer | Artist | Teacher

[Author]

Posts