how do i stop my content from sliding?
guys when i change the size of the window my 100%width image take more height space and makes my website slide down, how do i make it so i can keep looking at the same content instead of it sliding down?
20 Replies
hard to say without a minimal example maybe put it in a codepen
you could put a max-height on it and/or maybe use object-fit: cover
im trying to recreate a codesandbox but its not happening there in my other github sites its not happening either
@b1mind
when i change the size of the window all the content slides
diff view
without seeing your code, no one's going to be able to help. It's best to share it in a way where it's easy for people to run, so something like codepen or codesandbox. If you can't, you can find instructions on how to share it in a code block in #How To Ask Good Questions @pepegangster
looks to me like things are working fine xD but again use max-height and a object-fit: cover if you wanted to stop it from growing height but still fill. Like we have both pointed out though its all a guessing game without a demo/code.
so this is normal? no work around?
remember also that users almost never resize their browser when using a site
the codesandbox i tried to recreate it didnt happen although it was basically the same setup
https://codesandbox.io/s/peaceful-allen-n5tfzp?file=/src/App.js
Normal? I mean you have to grow in height to grow width of a image without distortion so yes
unless you are using cover with overflow or what not.
i dont want for all my content to slide tho, i find it kinda annoying
slide?
i would like to keep looking at the content im focus on
yeah its make me look at other part of the window and have to scroll to adjust
i feel my user will get disoriented everytime they change window size
again no one does that
like Jochem said no one is resizing their windows over and over they either have it docked up to half the screen typically or full screen.
cool cool i guess its ok if i leave it that way
but also like I pointed out I don't see it being any bad behavior its working responsively so 👍
or use my advice if you really don't want to it grow past a px amount
also on my github pages it doesnt happen but on my dev window it does, in another project
again without seeing it we have no idea
yeah its ok tho
bro ty ❤️
ty fammers