Pro header demo: get rid of line underneath menu item

I’m trying to learn how to use the new pro header builder.

I am adapting the demo header, but I can’t figure out how to get rid the small blue line underneath the menu items on hover. See here: https://www.datafreedoms.com/our-mission/

I also have a second problem…

I set that header (discussed above) as a global header, but now this page has a white gap up the top: https://www.datafreedoms.com/vpn/minty-vpn/

Why did that white gap appear? How do I fix it?

Hi There,

Thanks for sending the details!

The menu issue was due to a custom CSS and now it works fine.

For the page gap issue, there is issue with the template of custom post type, please add this CSS to your theme option Global CSS.

.vpn-template .entry-content {
margin-top: 0px !important;
}

Hope this helps!

Thanks.

Can you please tell me how you found that custom CSS inside the header? Like, which menu options did you click to find it? Because i searched and searched but could not locate the problem. I want to learn this for my own training.

As for the vpn-template. It uses the exact same template as the pages, so that is not the cause of the issue because the pages are fine. I need to identify the root cause of the issue and fix it, instead of applying global CSS to cover it up. What else could be causing the problem?

Here is the template…

<?php
/*
Template Name: No Container | Header, Footer
Template Post Type: page, post, product, vpn

*/
?>


<?php x_get_view( x_get_stack(), 'template', 'blank-4' ); ?>

Hi There,

Thanks for writing in again!

  1. The line was coming due to the style of anchor tag for the stack you are using. So I removed by adding a CSS like for all anchor tag
    that is a:hove { text-decoration: none;} you can find it in Global CSS.

  2. Regarding the template, X theme templates are conditional on each template based on the container class. If you see the no container class doesn’t have a entry-content class in the wrapper but your template having the class. Which having a top margin of 25px in the CSS. For that you need to change the template structure or you can use custom CSS that I have provided.

Hope this clear.

Thanks

Sorry but that still doesn’t explain why this is happening.

The home page is using the exact same “no container” template without any issues.

Inspect both pages (https://www.datafreedoms.com/ and https://www.datafreedoms.com/vpn/minty-vpn/) using chrome dev tools and you will see both have the same entry-content div wrapper you are talking about. So it does not explain why one page has the gap and the other does not. Both pages are using the exact same template wrappers.

If the home page is using the exact same template, why does it not have any white gap?

The styles for that template should be applying to all post types.

Seems like a bug to me?

Page template:

VPN template:

Hi There,

No its not a bug, its just your vpn-posts are not part of the theme.

We know that white space on top of your vpn-posts is the entry-content top margin.

On pages do you don’t get the entry-content top margin because of this theme CSS.

.page .no-post-thumbnail .entry-content {
    margin-top: 0;
}

The selector specifically says .page .no-post-thumbnail .entry-content, so yeah that won’t be applied on other posts besides the pages.

You can use that same custom CSS to resolve the white gap issue on vpn-posts, but instead of .page you use .single-vpn
You can see this classes on the <body> tag.

Hope this shed some lights,
Cheers!

I guess we just have a different idea of what a bug means.

If I add custom posts to my site and apply your templates, I expect them to work without custom CSS.

Theme X CSS fixes the gap problem for pages with margin-top: 0; but not on custom post types. That sounds like a bug to me, which hopefully gets fixed.

This is just a tiny example, but I’m finding this sort of stuff riddled throughout your theme.

Hi There,

Your feedback is greatly appreciated and we hope to address your points in as much detail as possible as it helps us to make X better and better.

Have a great day,

This topic was automatically closed 10 days after the last reply. New replies are no longer allowed.