Support › Forums › Flex Theme › Primary navigation background color & alignment
- This topic has 8 replies, 2 voices, and was last updated 7 years, 9 months ago by
Joseph.
-
AuthorPosts
-
September 8, 2015 at 3:10 am #531
Joseph
ParticipantHi support,
I try to change the primary navigation background color using these code screenshot: http://prntscr.com/8dv86y But it appears like this screenshot: http://prntscr.com/8dv7v2How can I change all the background color, and change the menu text alignment to center?
Regards,
September 8, 2015 at 3:20 am #533Davinder Singh Kanith
ModeratorFor background color issue, use following code
.site-navigation, .site-navigation .wrap { background: #8a2be2; }
To make menu center align,
1. Go to Appearance > Customize.
2. Expand “Primary Nav Extras” option, uncheck (no tick) this option.
Menu will center align automatically.September 8, 2015 at 3:55 am #536Joseph
ParticipantThanks Davinder for the code. Can you please provide me the background color code for site-footer and footer widget as well?
The center alignment doesn’t work even after uncheck the extra option screenshot: http://prntscr.com/8dvfx5
Regards,
-
This reply was modified 7 years, 9 months ago by
Joseph.
September 9, 2015 at 3:09 pm #538Joseph
ParticipantHi Davinder,
I manage to center the menu by placing this code:
text-align: center
under .genesis-nav-menu {But I would appreciate if you could provide the code for site-footer and footer widget as well. I try around but couldn’t change the whole block.
Regards,
September 9, 2015 at 5:28 pm #539Davinder Singh Kanith
ModeratorFor footer widgets, change following code…
.footer-widgets, .footer-widgets .enews p, .footer-widgets a { color: #444; }
to…
.footer-widgets, .footer-widgets .enews p, .footer-widgets a { color: #444; background: #8a2be2; }
September 9, 2015 at 5:32 pm #540Davinder Singh Kanith
ModeratorFor site footer area
1. Add background color to following code…
.site-footer { border-top: 1px solid #e3e3e3; color: #444; font-size: 14px; line-height: 1.3; padding: 20px 0; text-align: center; }
to…
.site-footer { border-top: 1px solid #e3e3e3; color: #444; font-size: 14px; line-height: 1.3; padding: 20px 0; text-align: center; background-color: #8a2be2; }
2. Change background color in following code…
.wrap { background-color: #fff; margin: 0 auto; max-width: 1140px; padding: 0 30px; }
to…
.wrap { background-color: #8a2be2; margin: 0 auto; max-width: 1140px; padding: 0 30px; }
September 10, 2015 at 2:44 am #543Joseph
ParticipantHi Davinder,
I add this code:.site-footer { border-top: 1px solid #e3e3e3; color: #444; font-size: 14px; line-height: 1.3; padding: 20px 0; text-align: center; background-color: #8a2be2; }
and it’s appear like this screenshot: http://prntscr.com/8eluis How can I just change this white color?
As if I use the other code of this:
.wrap { background-color: #8a2be2; margin: 0 auto; max-width: 1140px; padding: 0 30px; }
the whole page change as those screenshots:
http://prntscr.com/8elx07
http://prntscr.com/8elx54
http://prntscr.com/8elx86September 10, 2015 at 2:51 am #544Davinder Singh Kanith
ModeratorTry this code to change the white background
.site-footer .wrap { background-color: #8a2be2; }
September 10, 2015 at 11:40 pm #548Joseph
ParticipantThanks Davinder.
-
This reply was modified 7 years, 9 months ago by
-
AuthorPosts
- You must be logged in to reply to this topic.