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
How you summarizes the design using HTML and CSS
I was looking around for different design to improve my skill and came across to this design but I am confused how what will be HTML structure and ofcourse CSS.
I have done a little work, Below is my code
```
<div class="pizza--container">
<div class="container--img">...
Why does prefers-color-scheme need duplication of styles?
I was watching KP's video on using dark / light themes:
https://www.youtube.com/watch?v=zFFuV_vXNhY&t=36s
And it works nicely, but it bothers me that the styles are duplicated in :root definitions as well as the theme switcher ":has" definition.
Why is the duplication needed if I have selected the theme using color-scheme: [dark|light] declaration? It seems to override behaviour for system styles, but not anything I've defined.
G...
SVG and position absolute.
Hi, I would like to acomplish the design shown in image but with ability to use width 100% so it is responsive. The arrow is svg. And if I could I would like to in the end animate it that the line shortens on hover to the right, but I didnt yet get to it becose it didnt work in first place.
```<svg xmlns="http://www.w3.org/2000/svg" height="50">
<!-- Define an arrowhead marker -->
<defs>...