ChooKing
KPCKevin Powell - Community
•Created by snxxwyy on 7/6/2024 in #front-end
content scaling in proportion no matter the screen size
I remembered that was an issue for very narrow screens. I don't recall when I originally discovered it.
22 replies
KPCKevin Powell - Community
•Created by snxxwyy on 7/6/2024 in #front-end
content scaling in proportion no matter the screen size
I don't know why that causes a problem, but I noticed that piccallil doesn't have it.
22 replies
KPCKevin Powell - Community
•Created by snxxwyy on 7/6/2024 in #front-end
content scaling in proportion no matter the screen size
Try it without the initial scale. Only the width.
22 replies
KPCKevin Powell - Community
•Created by snxxwyy on 7/6/2024 in #front-end
content scaling in proportion no matter the screen size
OK. I just checked and it doesn't work with initial scale.
22 replies
KPCKevin Powell - Community
•Created by snxxwyy on 7/6/2024 in #front-end
content scaling in proportion no matter the screen size
That doesn't work for you?
22 replies
KPCKevin Powell - Community
•Created by snxxwyy on 7/6/2024 in #front-end
content scaling in proportion no matter the screen size
I copied your code into a regular project outside of Codepen and got it to work by adding this meta tag. It does not work in Firefox without it.
22 replies
KPCKevin Powell - Community
•Created by snxxwyy on 7/6/2024 in #front-end
content scaling in proportion no matter the screen size
I found the key.
22 replies
KPCKevin Powell - Community
•Created by snxxwyy on 7/6/2024 in #front-end
content scaling in proportion no matter the screen size
Looks like piccalil still works on Firefox but your codepen doesn't.
22 replies
KPCKevin Powell - Community
•Created by snxxwyy on 7/6/2024 in #front-end
content scaling in proportion no matter the screen size
Which browser did you use? I initially tested on Chrome when it worked. I retried on Firefox and it does not work even when the code is on top.
22 replies
KPCKevin Powell - Community
•Created by snxxwyy on 7/6/2024 in #front-end
content scaling in proportion no matter the screen size
Did you only test your code in Codepen? I noticed that your code actually works, but it depends on the placement of the code in codepen. If I put the code on the left or right, it doesn't work. However, it works perfectly fine if I place the code on top, which gives your layout the full width of the window.
22 replies
KPCKevin Powell - Community
•Created by snxxwyy on 7/6/2024 in #front-end
Input design method
I am assuming that a width in cm would be a number. For that, I would set type="number" and also inputmode="decimal".
24 replies
KPCKevin Powell - Community
•Created by empty on 7/4/2024 in #front-end
problem with input type number
Did you originally have += instead of +? That would have concatenated the new value to the previous one. Changing that to a plus performs the unary plus operation of converting a string to a number.
5 replies
KPCKevin Powell - Community
•Created by loss on 7/5/2024 in #front-end
eventListener on click
Your last line of code has an error. The second parameter of addEventListener() must be a function. What you provided is a function call and not a function. The result is that the parameter is actually the value undefined, because it calls checkIsEmpty and that function doesn't return anything. The parentheses after checkIsEmpty calls it. Those parentheses must be removed to pass the function as a callback.
68 replies
KPCKevin Powell - Community
•Created by dysbulic 🐙 on 7/2/2024 in #front-end
What are the dangers of allowing a user to specify a stylesheet?
Background images can be set in CSS, so it's possible to insert spam or porn. It's also possible to replace content on the page, which could be the basis for a scam.
5 replies
KPCKevin Powell - Community
•Created by smackalpha on 7/1/2024 in #front-end
How to make slope box in css.
If you want to use this approach and you can accept the lack of rounding, this is an example of how to do it: https://codepen.io/chooking/pen/RwmXNBa
7 replies
KPCKevin Powell - Community
•Created by smackalpha on 7/1/2024 in #front-end
How to make slope box in css.
Also, the shape that you want has a slight bit of curvature at the corners. The approach that you are using will only work if you are willing to accept sharp corners.
7 replies
KPCKevin Powell - Community
•Created by smackalpha on 7/1/2024 in #front-end
How to make slope box in css.
You commented out the clip path, so it's not going to do anything. Also the coordinates in that path do not match the shape in your example.
7 replies
KPCKevin Powell - Community
•Created by asasinmode on 6/25/2024 in #front-end
prefers-reduced-motion is a text color animation ok?
It doesn't irritate me.
6 replies
KPCKevin Powell - Community
•Created by asasinmode on 6/25/2024 in #front-end
prefers-reduced-motion is a text color animation ok?
I am affected by it.
6 replies
KPCKevin Powell - Community
•Created by asasinmode on 6/25/2024 in #front-end
prefers-reduced-motion is a text color animation ok?
That still creates the illusion of movement. Maybe just animate the dots in the ellipsis. It's a much smaller change, so it causes less irritation.
6 replies