Hey guys
As I tried to reach you through the email support I am posting this issue here upon @Nelson’s request
Here’s the status of the website I am currently working on right now. I was able to do on or about 96% of it on webflow. However 2 main issues remain yet unresolved which are the following:
1-The first issue has been already published through the forum which you can find it here again:
Here the published website link:
http://old-sinks2.webflow.io
And here is the shared website link:
https://preview.webflow.com/preview/old-sinks2?preview=ed69e1d60580e6d5c82f4b7d46abd436
Since I haven’t got any reply to this topic, I exported the code and published it online through cpanel since my client has already chosen their hosting plan.
Before publishing, I opened the webflow.css and changed the position of the following class “.w.nav-overlay” from static to inherit. and added a height: auto !important to it.
By using this method I was able to solve this issue but not through webflow though, for 2 reasons:
reason1: there is no “inherit” for the position property in the Style panel in webflow.
reason2: While tracking the behaviour of the navbar I noticed by using “inspect element” that there is a height that is being generated to the class “w-nav-overlay” as shown in the screenshot below:

Now when I go back to the Style panel on webflow’s dashboard it’s not there.
For now, this has been resolved outside webflow, but I am wondering if we can fix it through your web app, coz I am pretty sure I might have missed something or did something wrong which I haven’t been able to track or find the solution for it. Plus I am pretty sure I might encounter this in future projects so might as well have already a solution for it (:
2-The second issue is the pin it hover button.
I have inserted the following pinterest script for the pin it button inside the in the custom code panel:
<script src="//assets.pinterest.com/js/pinit.js"
type="text/javascript" async defer
data-pin-hover="true"></script>
<script type="text/javascript">
$(document).ready(function(){
$("img").each(function(){
if(!$(this).hasClass("w-lightbox-img w-lightbox-image")){
$(this).attr("nopin", "true");
}
});
});
</script>
Now when I publish the website, you can see whenever you preview any photos from “Bathroom Sinks” section the pin it button appears on the top right when you hover on the photo as shown below:

Now when I preview any photo from “Kitchen Sinks” or “Other Sinks” sections, the pin it doesn’t appear anymore as shown below, at least not in its actual position like in the previous photo:

By using inspect element I found out the pin it button was there on all images, so after scratching more I zoomed out the window and I found out the pin it button was sitting way on top of the images for both sections “Kitchen Sinks” and “Other Sinks” as shown below:

I am still working on finding a way to fix this outside webflow but still haven’t found any solution yet.
So i was thinking maybe you can assist in this too.
Again thanks a lot for reaching me again, I will be waiting promptly for your support since I have to finish this website before my deadline :s