Footer widgets misaligned when using column CSS
- The topic ‘Footer widgets misaligned when using column CSS’ is closed to new replies.
Need help? Check out our Support site, then
Hi!
I’ve used the following code (which I found in a previous question on this forum) to display the footer widgets in columns instead of one over the other:
.widget-area-footer{display:flex;}
.widget-area-footer section{width:33%;padding:20px}
The problem is that the last widget shows a little higher than the others. I’ve noticed that, if I insert a blank widget after the last one, they all align fine. But then I have a blank column at the end.
Is there some way I can get all the footer widgets to align properly?
Thanks for your help.
The blog I need help with is: (visible only to logged in users)
I’ve just realized that the columns also don’t stack on mobile. Can this be fixed, too?
Thanks!
Hi,
try this
@media(min-width:767px){
.widget-area-footer{display:flex;}
.widget-area-footer section{width:33%;padding:0 20px}
}
}
instead.
Let me know if this worked for you.
This worked perfectly! Thanks!