[Cara RParticipant]

Hello, again!
I am trying to figure out how to add a line (horizontal rule) to the top of my footer content. I’d like it to appear below footer menu but above footer content. I’d also like it set to this opacity:
opacity: 0.5; filter: alpha(opacity=50)

I’ve floated my social Icons in the footer to display to the right of the footer content using the customizer.

to help illustrate my request the site URL is biddybb.com/dev

Thanks Again! You guys totally rock!

Cara

[ChristianModerator]

Hey Cara,

Please give us a screenshot of the area as we don’t see a footer menu.

Thanks.

[Cara RParticipant]

This reply has been marked as private.

[Nabeel AModerator]

Hey Cara,

Thanks for providing us the mock-up.

1. To change the style of the last two buttons, add the following CSS code via Appearance > Customize > Custom > CSS:

#menu-item-199 a {
background-color: #f0d236;
padding: 8px;
border-radius: 2px;
border: 1px solid #EAEC68;
}
#menu-item-198 a {
background-color: gray;
padding: 8px 28px;
border-radius: 4px;
border: 1px solid #2b2b2b;
}

Also please remove your previous CSS

2. For posts widget:

.x-colophon.top a {
color: gray !important;
font-size: 18px !important;
}
.dateline {
color: gray;
font-size: 12px;
}

3. To add the line between footer content:

.x-colophon.top {
padding-bottom: 50px !important;
border-bottom: 1px solid gray;
}

Let us know how this goes!

[Cara RParticipant]

Hey guys,
I just inserted the code you sent. For the line between footer content I had to go in and add the padding to the featured post widget itself in order for it to show- like this:

#featured_post_widget-2 {
padding-top: 0px 0 !important ;
padding-bottom: 50px !important ;
line-height: 1.3 !important ;

So that is now fixed! Thanks!

For the font color change for the dateline on the featured posts widget, the line of code supplied did not have an effect. any ideas as to why?

However the post title font color change did work. So thanks on that one.

The changes to the buttons worked beautifully!

One last question, for now 😉 – How can I get the line that appears under the nav bar menu links indicating current page as well as upon hover to not appear? (on my site it is a white line)

thanks, again for such a speedy reply. You guys are awesome!

[ChristianModerator]

You’re welcome Cara. Please add the code below in your Appearance > Customize > Custom > CSS.

.x-navbar .x-nav > li > a:hover, .x-navbar .x-nav > li.current-menu-item > a {
-webkit-box-shadow: none;
box-shadow: none;
}

Hope that helps. 🙂

[Author]

Posts