How to center bottom footer content?

Hi: Is there a way to center the bottom footer content instead of top line align left and bottom line align right? Please see http://fwvetspecialty.com/

There are 2 footers. The top footer (light blue background) is where the footer widgets go. I don't have any in there just yet.

The bottom footer (darker blue background) is picking up content from the site name and site description, plus content I entered in the Theme Options footer section. I need to make both those centered, so it looks like this:

Fort Worth Veterinary Specialty & Emergency Hospital - Advanced multi-specialty veterinary facility serving Fort Worth and West Texas pets​

​

Copyright © 2015 Fort Worth Veterinary Specialty & Emergency Hospital. All rights reserved. | Website by D Media​

​

I found the CSS that controls this but when I made it centered it worked on the desktop Theme but the not the mobile:​

​

.footer-navi .navigation .right-navi {
float: right;
margin-right: 25px;
width: 418px;
text-align: right;
}

I must missing something. Appreciate your help!

​

 

Hello,

Greetings from InkThemes,

You can resolve it yourself, All you have to do is just go to Dashboard->Appearance->Theme Options->Styling Option->Custom CSS

field and try to cut paste the given below CSS code there.

Code:

.footer-navi .navigation ul {
  float: none;
  text-align: center;
  margin-bottom: 10px;
}
 
.footer-navi .navigation .right-navi {
  float: right;
  margin-right: 25px;
  width: 100% !important;
  text-align: center !important;
}

Hope this will resolve your issue.

Do let me know if you need more assistance,

I would be glad to assist you further,

 

Thank you. That centered the top line: "Fort Worth Veterinary Specialty & Emergency Hospital - Advanced multi-specialty veterinary facility serving Fort Worth and West Texas pets"

The bottom line: "Copyright © 2015 Fort Worth Veterinary Specialty & Emergency Hospital. All rights reserved. | Website by D Media" that centered it on desktop theme but not mobile.

I removed the 25 px margin and made it "float: none" instead of "float: right" but that didn't make a difference.

 

Hi Dmedia,

Please paste the code given below in Custom CSS section
(Appearance -> Theme Options -> Styling Options -> Custom CSS) of your dashboard.

Code:

@media only screen and (max-width: 480px){
.footer-navi .navigation {
  margin-left: 5px !important;
}
}
@media only screen and (max-width: 767px) and (min-width: 480px){
.footer-navi .navigation {
  margin-left: 0px !important;
}
.footer-navi .navigation .right-navi p {
  margin-left: 0 !important;
}
}
@media only screen and (max-width: 960px) and (min-width: 768px){
.footer-navi .navigation ul li a {
  margin-left: -36px !important;
}
.footer-navi .navigation .right-navi p {
  margin-left: -15px !important;
}
}

Thanks,
Praveen

 

That worked perfectly! The desktop AND mobile bottom footer content is now centered. Thank you!