Archived topic
elements overlapping on each other.
5 replies · Started by Swadhin on August 27, 2019
Hi,
I have two elements added in the "After content" hook. One has priority 10 other 20. Still both are overlapping on each other. See it here- http://cloud.wpfy.org/3ad81d
Another thing is I have added the sub box via HTML. How ever it's width is smaller than author box. Which I can't remember specifying in css- You can view HTML and CSS of sub box here-
Thanks
Hi there,
The overlapping is happening because one of the elements has the modal class, which is set to position: absolute elsewhere.
You should be able to fix it by removing that modal class from that specific element.
I think this will fix the second issue as well.
Let me know :)
Hi Tom,
Thanks for the reply!
I have updated the modal class to something different & updated the html and css accordingly. However this didn't fix the issue.
Here is the updated css and html I am using - css & html
Upon digging I found that position: absolute is being added by the social sharing plugin I am using. ie- Easy Social Share Buttons for WordPress
Is there an easy fix for it? Otherwise I ask plugin developer to fix it.
This didn't fix the second issue as well.
Thanks
Here's what I'm seeing now: https://www.screencast.com/t/a4P1ZKqZ
It looks like the overlapping isn't happening anymore?
Let me know :)
I solved it manually.
Did you get chance to look into the 2nd one?
Hi there,
Sub Box is actually the correct size, it is fitting within the max-width you have specified for the content.
Whereas the author box is larger then it should be due to the 3% padding added to the author-box container. To reduce the author-box to the same size you would give it the box-sizing: border-box; property.
Making the Sub Box bigger would mean making some adjusts to the HTML and CSS.
