Responsive left footer widget

[jknetdesign]

http://ajhproperties.com/

In the footer, any idea of a simple solution so the photo won’t crash into the center widget?

I tried this CSS on the 920 break point.

@media only screen and (max-width: 920px) {
#footer-widgets .block {
  margin-right: 2.8% !important;
}
.block.footer-widget-3 {
  margin-right: 3% !important;
}
#footer-widgets.col-3 .block {
  width: 29.75% !important;
}

}

[timbarden]

You may find that using box-sizing: border-box; on your 3 elements (with padding instead of margin) might be a bit easier, then you could just add even widths to your widget .block class, and lose the margin-right: 3.8%;

width: 33.33%;
padding: 0 1.5em;
box-sizing: border-box;

I’d also recommend putting a height: auto; on your img too, to stop it squishing

[Author]

Posts