wpDiscuz - WordPress Comment Plugin
Avatars floating OV...
 
Share:
Notifications
Clear all

Avatars floating OVER sticky headers with Elementor during scroll  


Caver01
Posts: 2
Topic starter
(@caver01)
New Member
Joined: 7 months ago

Using Elementor page builder configured with a sticky header that that stays at the top of viewport (has search, nav menu). As I scroll a post with comments, the avatar circles float over the header as they scroll past instead of under with the rest of the post content. I am using layout #3 if that matters. The avatar circles—even default images—do not respect the z-index of the sticky header which in my case is set to 2000. I tried to style the circle elements but could not figure out the CSS needed so I had to set display: none. This is not really a good workaround since now I have no avatars at all, but at least the visual is not messed up. The rest of the comment layout works as expected. Only the avatars float over the sticky header. Ideas?

 

4 Replies
Asti
Posts: 1940
 Asti
Support
(@asti)
Support member
Joined: 3 years ago

Hi @caver01,

Could you please provide us some example URL? 

Reply
2 Replies
Caver01
(@caver01)
Joined: 7 months ago

New Member
Posts: 2

@asti

I was able to implement a workaround by adding CSS to Styles and Colors settings area of wpDiscuz:

 

.comments-area{opacity:.99;}

By setting opacity to less than 1 I created a new stacking context for the comments area. This keeps everything under my sticky header. Not ideal, but it works.

Reply
Asti
 Asti
Support
(@asti)
Joined: 3 years ago

Support member
Posts: 1940

thank you for sharing the information. 

Reply
Caver01
Posts: 2
Topic starter
(@caver01)
New Member
Joined: 7 months ago

Yes. This is a production site, but I temporarily took out my display: none so the avatars are visible again. Try this:

https://summitsips.com/2011/08/drink-of-the-week-cuba-libre/

 

I should add that I don't see it on Chrome and Firefox, but Safari on a Mac, and mobile S

afari on iPad Pro, iPhone all reveal the problem.

I need to fix it later, so hopefully a short window will allow you to see. Also, here is a screenshot attached.

Screenshot
Reply
Share: