Sticky sidebar anchoring issue

I am building a sticky sidebar with bottom anchor linked to the bottom of the right side content. Everything works fine except when the content on the right side is less.

Basically when the content of the right side is less it’s height is smaller than the left sidebar and since left sidebar is anchored to the bottom of the right side content in the above scenario, when the page loads the sidebar moves up aligning the bottom of the left sidebar with right side content.

I tried to use top anchor but in that case when right side content is more the sidebar overlaps my footer once I scroll down completely.
Please help.

Which exact version of Foundation Sites do you use?

"foundation-sites": "^6.5.0-rc.2"

This is from my package.json. I believe this is the version.

Please check your lockfile for the version that you use and node_modules/foundation-sites/package.json. The entry in the package.json is not the version that is used. According to your SemVer entry it should be 6.6.1.

I am sorry but I don’t know about this lockfile you are asking me to check.

Also, I checked the node_modules/foundation-sites/package.json there too I found same version as I mentioned before- “version”: “6.5.0-rc.2”

Sorry again I am not proving very helpful, but I’m new with this, so please help me :slight_smile:

It seems you have an old version installed. Please run npm update foundation-sites or npm i foundation-sites@6.6.1.