@Chenxi96
Posted
Hi Filip,
This looks good, I suggest that you use position: absolute for div#bubble-div and div#bubble-triangle. This way you remove these div’s out of the regular flow of the web page. This will remove the small jump. Let me know if this helps!
@FilipSzkarlat
Posted
@Chenxi96 Hi thanks for the comment.
I tried position: absolute first, but it only worked for one screen width, e.g. 1440, but when changing the width, the div was also moved, so out of the two I chose position: relative with a slight jump.
@Chenxi96
Posted
Hi @FilipSzkarlat,
I see what you mean, so on mobile screen size you have div#profile margin-top: 30px change that to padding-top: 30px and have the height: 70px so that the height matches with div#profile-share. Since you use margin-top it changes the space between elements that is why you are seeing that jump in mobile screen size. This should eliminate your issue.
Marked as helpful
@FilipSzkarlat
Posted
Hi @Chenxi96,
Actually, I was talking about the problem of jumping in the desktop view, but thanks for the advice on jumping in the mobile view, I used it and it works. Moreover, I came up with another idea to eliminate the jump in the desktop view and placed an invisible div with the same height as the pop-up bubble when clicked. So the height is preserved and there is no more jump.
Thanks for the help.
Cheers
