Twitter clone problem

Someone please help me fix my bug here!

I basically want the Column-3 to stop scrolling at the end of the footer links while the column-2 still scrolls just as it is on Twitter desktop view.

I know this is achievable using JS but unfortunately for me, I haven’t learnt JS. So is there a way I can get this solution using css alone??

This is my code
https://codepen.io/Creatorjihm/pen/ZEVVebj
I’ve reduced the code as minimum as possible.

It should behave just like this

CodePenCreatorjihm

ZEVVebj

...

CryptojihmeeOP•10/8/23, 8:47 AM

Please help someone

…

MarkBoots•10/8/23, 9:06 AM

No, nothing comes to mind in how to it solve in css. I think they are recalculating the top and bottom margin of that column, based on the body scroll position. So with JS.

MMarkBoots No, nothing comes to mind in how to it solve in css. I think they are recalculat...

CryptojihmeeOP•10/8/23, 5:15 PM

Damn…that’s just the remaining piece of the whole puzzle

Ig I can’t showcase as a completed project until I’ve learnt and implemented JavaScript on it

All the same, thanks for the help

C_7•10/11/23, 3:34 AM

https://codepen.io/Q-C_Q-C/pen/XWoGWOe

CodePenQ “C_Q” C

XWoGWOe

...

C_7•10/11/23, 3:35 AM

You can try this. This is the problem of html and css layout.

CC_7 You can try this. This is the problem of html and css layout.

CryptojihmeeOP•10/11/23, 6:28 PM

Thanks…I’ll check it out and drop a feedback!

CC_7 You can try this. This is the problem of html and css layout.

CryptojihmeeOP•10/11/23, 9:47 PM

I just tried this solution but the result wasn’t as such that I wanted…from this solution the col-2 and col-3 scrolled individually, hence they all stopped at the end of their contents(individually).

Meanwhile the result I wanted was to control both col-2 and col-3 with same scroll (they should scroll together) but when col-3 hits the end of its content, it should stop scrolling while the col-2 continues scrolling until it gets to the end of its content.

I hope this is understandable!

CryptojihmeeOP•10/11/23, 9:49 PM

All the same, thanks for the solution as I’ll just make use of it since I’ll have to get the real result using JS which I haven’t gotten knowledge of…I’ll probably update it in the future after learning JS

CCryptojihmee Someone please help me fix my bug here!😩 I basically want the Column-3 to stop ...

Zoë•10/12/23, 2:47 AM

https://codepen.io/z-/pen/mdaoGeY/26fc0e7fdd2f9116191dbc7baad3777a

CodePenZed Dash

Stickyish sidebar for Saagy

...

Zoë•10/12/23, 2:58 AM

It's 4AM for me and so there's likely some issues with it and I know it doesn't handle when screens get shorter or taller well (it's fine as soon as you scroll but to be fair Twitter doesn't handle it either). You may want to listen for resize events

~~Edit: I just viewed on mobile and I realise I didn’t cap the margin and if I pull the screen down the sidebar can go off the screen~~ fixed with a clamp

CryptojihmeeOP•10/12/23, 9:59 PM

@z- ::theProblemSolver:: you strictly made use of JS which I haven’t gotten knowledge of…

I’ll just have to pause the project until I’ve gotten some JS basics at least

CryptojihmeeOP•10/12/23, 10:00 PM

Thanks for the help anyway

Zoë•10/12/23, 10:27 PM

Like others have pointed out it’s not possible without JS