Topic: 3 questions about Renew header

Tagged: x

Author

Posts
December 27, 2016 at 10:02 pm #1306656
crucialtim
Participant
Hello,
I’ve got three questions about the Renew header that I could use a little assistance with.
1. How can I change the height of the topbar?
2. How can I change the position of the submenus? I’m hoping to move them up closer to the main navigation items
3. I successfully hid the social icons in the header. In that space, I’d like to add custom text. How do I do that?
Screenshot attached that outlines these 3 things. Thanks!
December 27, 2016 at 10:04 pm #1306661

crucialtim
Participant

This reply has been marked as private.

December 27, 2016 at 10:50 pm #1306694

crucialtim
Participant

Since the new “Additional CSS” option showed up in Customizer, I’m noticing some funkiness too. I had some custom code to make the mobile nav say “Navigate” on a phone instead of just the hamburger menu. Now, I can’t seem to add any CSS via the old “custom” tab in Customizer. But if I try to change or comment that code via “Additional CSS,” nothing happens.

December 28, 2016 at 12:13 am #1306750
Rupok
Member
Hi there,

Thanks for writing in!

#1. You can add this under Custom > CSS in the Customizer.
```
.x-topbar {
  height: 40px;
  min-height: 40px;
}
```
You need to adjust the margin and padding for the paragraph inside to align them properly.

#2. You have already added mutiple CSS for this :
```
.x-navbar .desktop .x-nav > li ul {
    top: 80px;
}
.x-navbar .sub-menu {
    top: 90px !important;
}
.x-navbar .sub-menu {
    top: 50px !important;
}
```
You should keep one and remove others. 80px should work fine.

#3. You can use the Topbar Content area to place your text.

And I can’t see any issue with the Customizer > Custom CSS as it’s working as expected.

Cheers!
December 28, 2016 at 9:23 am #1307239

crucialtim
Participant

Thanks! Got #1 and #3 taken care of, but still having a problem with #2, and I suspect it’s because of the customizer issue I’m experiencing.

If I try to add custom css the way I normally would, via Customizer > Custom > Edit Global CSS, I get a small black window that I can’t do anything with. I used to copy and paste my custom css in there, but I can’t do anything with it anymore.

I also noticed recently that in Customizer, I’ve now got (all the way at the bottom) “Additional CSS” – so I added my custom css here.

I think that there may be some custom styles hanging out somewhere that I can’t access and that’s what’s causing my issue here. I say that because of what you mentioned above for the 3 multiple styles I’ve got, all I actually have in the custom css file I’m working with now is this: `.x-navbar .sub-menu {
top: 50px !important
}`

I don’t have the other two styles you referenced in my custom css file, which I’m now adding via “Additional CSS” in Customizer… and I can’t add/edit/delete anything via Customizer > Custom > Edit Global CSS, the way I used to.

Note: not sure if it helps, but for years, i was using Integrity Light and recently switched things over to Renew, because (for a period of time) I wanted to try out the revolution slider on top of the navigation. I scrapped that yesterday. I’m wondering if something got messed up when I switched stacks? There doesn’t appear to be any reason for me at this point to be using Renew… or it doesn’t seem to really matter which stack I use, because everything I’ve done here is custom anyway.

December 28, 2016 at 10:22 am #1307306
Joao
Moderator
Hi

Everything seems to work fine on my end.

You have the code :
```
.x-navbar .sub-menu {
	top: 90px !important
}
```
Please change to
```
.x-navbar .sub-menu {
	top: 60px !important
}
```
You might have been experiencing some browser related issue, please clean your browser cache and also try a different browser.

Hope that helps

Joao
December 28, 2016 at 12:38 pm #1307457

crucialtim
Participant

Looks like it’s a Safari issue. Customizer > Custom > Edit Global CSS works in Chrome but not Safari.

December 28, 2016 at 1:14 pm #1307498

Joao
Moderator

Hi There,

It might be specific to your safari it is not a general issue,

Try re-installing Safari.

Let us know how it goes,

joao
Author

Posts

<script> jQuery(function($){ $("#no-reply-1306656 .bbp-template-notice, .bbp-no-topic .bbp-template-notice").removeClass('bbp-template-notice'); }); </script>