Mobile Footer Help

MetOne · July 2017

Hello!

Currently trying to make the footer on: https://dev.casacompliance.com/ a bit more mobile responsive. Currently it looks fine on desktops and tablets however on mobile the logo either moves over the text or it just doesn't look right with the text alignment either side

Is there a way to force the footer to centre align the items on mobile? I've tried the following:

@media only screen and (max-width: 768px){
.footer-widgets, .footer-widgets .sidebar-column {
text-align: center;
}
}

But it doesn't work unfortunately. Any ideas?

Bryan · July 2017

Hi,

this is the css you need

@media only screen and (max-width: 768px){
  #Footer aside .textwidget {
    text-align: center !important;
  }
}

You will have to delete the align=right that you have added to the right div for it to work.

Bryan · July 2017

Hi,

this is the css you need

@media only screen and (max-width: 768px){
  #Footer aside .textwidget {
    text-align: center !important;
  }
}

You will have to delete the align=right that you have added to the right div for it to work.

MetOne · July 2017

Thank you very much!

It's definitely working however now the right hand box looks wrong. Is there no way to either have it right aligned normal, or just increase the padding so it's not so close to the centre logo.

Bryan · July 2017

Use also this css

#text-5 {
	text-align:right;
}

Mobile Footer Help

Comments