wpDiscuz - WordPress Comment Plugin
wpDiscuz is adding ...
 
Share:
Notifications
Clear all

[Solved] wpDiscuz is adding an invisible div over my navigation menu


erh
Posts: 3
 erh
Topic starter
(@erh)
New Member
Joined: 4 weeks ago

This is my header navigation menu on the top right of my website:

This is an invisible div that wpDiscuz is adding over the top:

Notice it covers the menu, making it so the menu items aren’t “hoverable” or click-able.

This is the CSS associated with the div wpDiscuz is adding:

I’m tempted to override the CSS with different values for top or right or z-index, but wanted to ensure I wasn’t breaking some sort of wpDiscuz functionality. Or to see if there wasn’t a better way to fix the issue.

You can see it for yourself here:  https://www.practicalnetworking.net/

It’s worse in Mobile view… the invisible Div prevents clicking of the hamburger menu:

(I added a blue transparent background color to the #wpdiscuz-comment-message div to make it easier to see).

This is the offending div:

<div id="wpdiscuz-comment-message" class="wpdiscuz-comment-message-unauth"></div>

Given the ID/Class, I am guessing this is where some message pops up when a user adds a comment? Or possibly the live notification when a comment is added?

 

5 Replies
Asti
Posts: 3580
 Asti
Support
(@asti)
Support member
Joined: 4 years ago
Posted by: @erh

Given the ID/Class, I am guessing this is where some message pops up when a user adds a comment? Or possibly the live notification when a comment is added?

Yes, this displays the wpDiscuz message. 

Please reactivate the wpDiscuz plugin to allow us to check the issue. 

4 Replies
erh
 erh
(@erh)
Joined: 4 weeks ago

New Member
Posts: 3

@asti

Plugin is still active. I just checked, I still see the div. It's possible you need to go to an actual blog post (where a comments section exist) and not the home page.  Here's a link to one:

https://www.practicalnetworking.net/practical-tls/practical-tls-free-ssl-training-m1/

image

 

The offending div is "stuck" to the right edge of the screen, so you may have to play around with your resolution and viewport width to find it.

Asti
 Asti
Support
(@asti)
Joined: 4 years ago

Support member
Posts: 3580

@erh,

Please use this CSS code:

div#wpdiscuz-comment-message {
    padding-bottom: 5px;
}

It should solve the issue. 

Put the code in the Top Admin Bar > Customize > Additional CSS > "Additional CSS" textarea, save it, delete all caches and check again.

erh
 erh
(@erh)
Joined: 4 weeks ago

New Member
Posts: 3

@asti Thank you.

 

What would be the harm in setting the padding-bottom to 0px? 

 

That seems to disappear the box entirely. Unless content exists within the Div... in which case it will be obvious why the button isn't clickable.

Asti
 Asti
Support
(@asti)
Joined: 4 years ago

Support member
Posts: 3580

@erh,

Please watch this video: 

https://www.screencast.com/t/St3kfEtjCqH  

Share: