image not loading on vercel deployment
I m using react + vite , and the issue is that the destination page images r visible on my local host but when I deployed code on vercel the images don't load , I think it's a pathing issue but I m not sure what to do .
Deployment: https://chet-space-tourism.vercel.app/
And the GitHub for repo is : https://github.com/Chet25/spaceTourism
;-;...
Content overflowing
when the height of the screen is decreased the content of the container are overflowing and the content is responsive when the width is adjusted,also i want the image ogf iphone to be at the bottom edge of container.Please help me resovle it
link:https://stackblitz.com/edit/stackblitz-starters-7czjm2?file=index.html...
Issues with flexbox
Hi guys I am doing some practice for css because I am really bad and I am also learning tailwind at the same time.
my problem is I don't now why I can justify-center a div is what I am doing impossible or what am I doing wrong
```js
<div className="flex justify-center items-center gap-[4.5rem] h-[55vh]">
<div className="flex-col justify-center">/ISSUE/...

Good design ideas for smaller screen?
As you see in the image below the blue button that says "add" is way to big for the smallest size screens, Does anyone have any ideas to make this look better?
https://codepen.io/hrphyn/pen/QWPWVJa...

Inifinite Scroll width issue
I have been seeing this video: https://www.youtube.com/watch?v=iLmBy-HKIAw. There applies a solution when clips the animation, that is not working in the width I'm using
CSS border-image
Why cant i get
border-image: linear-gradient(red,green);
to work but border: solid red;
does, What could be causing it to do this?
cant put elements on the level a photo is
basically i am making a portfolio for myself while learning html css and js and i have a photo at the top and some text below it but when i add a new element for a home button and i want it to be at the top level like where the photo is it wont let me and it wont let me put anything in that area the photo is (creating a new element just puts it above where the element is on the left, see image)

sticky element move outside parent element
So... I don't really have an issue. It's just a question... But, i have always thought an element with position:sticky; cannot move outside the parent element. But i just realized today that it can actually move outside parent element... But this is really strange.
To make position:sticky; element move out from parent element, the parent element needs
display:initial;
. But the strange thing about this is that as far as i know display:initial;
will revert the display value to it's initial value (the default value) but even if you have never changed the display value of the parent element, it the sticky element wont follow until you add display:initial; to parent element.
Can anyone explain this to me because this really makes no sense at all. I am so confused 😂 ...Absolutely positioned element not behaving as expected
I expect it to stick to the div called flex but it isn't for some reason I've tried debugging In the pen it isn't working at all
https://codepen.io/Dev-T/pen/ZEZEaNJ...
Slider/Carousel
does anyone know how to recreate this? I tried slick and other slider library but no luck
https://dribbble.com/shots/6476011-Quotes-slider...
Unable to find the error
I'm trying to apply animation to a box,in the html i created a div with class ="box" and i gavE the animations,i wanted the box to move along the border of the viewport,and change color after the box moves along next side.But it is not moving along,its just changing the colors
React beginner question
Do we need to know what all the react build tools do(like:vite,eslint etc) and add them manually using npm or is it more efficient to use create-react-app
How to move elements inside a container? (vague, I know)
https://github.com/callum-laing/shopping-site
Apologies I tried putting this into codesandbox but it spazzed out, and codepen didn't want to do it either.
I'm trying to find out how I move the positioning of the 2 elements on the side (CDL, and the shopping cart image). I tried padding-left and padding-right on the header, but that also moves the links in the middle, is there a better alternative here that doesn't disturb spacing of others?...

Media Queries
Hello, could somebody please tell me what I am doing wrong?
I have been learning media queries and I do not understand why the video, and 3 floating things are not staying together,
is it the set 75vh? I have tried to changing the height at the break point but it does'nt seem to do anything, also creates gaps within other divs.
please help. please and thank you. im really just asking on advice for media queries, ive looked at a lot of videos mostly Kevins, simply cannot grasp all the concepts.
...

Logo with fixed position, but relative to the container
Hello guys! As you can see in the video a part of the logo should be “fixed” and moving through the whole website. How should i make this? If i use “position: sticky” it just stays in it’s section, if i use “position: fixed” it overflows the container stylings and it wont shrink together with the original logo when the screen size is changing. Any help would be life changing 🙏🏼 Thanks, Andrew