All Questions
Tagged with css-box-shadow or css
807,328 questions
0 votes
0 answers
32 views
How can I apply this SVG curve path to a div background or clip-path in CSS?
mario kart header I’m trying to create a header layout with a specific curved shape. The small squares are SVGs, but I can’t reproduce the curved blue border using CSS clip-path. Here is the path I ...
0 votes
0 answers
25 views
Div partial Css masking
There is a div with a gradient. Behind that div is an animation. With css mask parts of the gradient are transparent so the animation can be seen through. The div actually actually contains another ...
1 vote
0 answers
41 views
CSS Lists in a specific format
I am wondering if you could automatically create a list in the following format: A. I. 1. a) aa) (1) (a) (aa) etc. etc. Could anyone help me accomplish this? I am asking for my Anki-template I ...
1 vote
0 answers
37 views
Is it possible to create a custom cursor with page scrolling on mobile using JS? [closed]
I've tried to create a custom cursor for mobile devices, but when the page is scrollable, the custom cursor doesn't follow your finger properly or it drops frames. Has anyone succeeded in creating a ...
Advice
1 vote
1 replies
29 views
Make native pinch-to-zoom trigger real layout reflow (without horizontal scroll) on mobile
I need the native pinch-to-zoom gesture in mobile browsers to behave like true browser zoom: when the user pinches, media queries should reevaluate and the layout should reflow. At the same time, the ...
0 votes
2 answers
43 views
Tailwind dark mode classes not working even though .dark class is applied
I'm trying to implement dark mode in my Next.js app using TailwindCSS. However, TailwindCSS's dark: classes are not being applied, even when the .dark class is present on the <html> tag. global....
-1 votes
2 answers
112 views
Why is my CSS outline appearing on input for both mouse click and keyboard focus despite using :focus-visible?
I have a simple HTML page with an input element: input { outline: none; } input:focus { outline: none; } input:focus-visible { outline: 1px solid black; } <input /> My goal is to remove ...
-1 votes
0 answers
32 views
How to override Radix theme ::before ::after styles [closed]
I am using Radix theme https://www.radix-ui.com/themes/docs/overview/getting-started and I am specifically using the Table component. I want to override default styling for just the Table.Header ...
0 votes
0 answers
37 views
Position sticky top animation works only when scrolling down, otherwise there is a jump
I have a sticky bar on the right side of my page and I want to animate its top property (and height) to nicely fit its transition to disappearing announcement bar at the top of the page. Below video ...
0 votes
0 answers
39 views
How must I set a title <h1> with logo and top- and bottom- border with CSS? [closed]
My goal is to create a section with a title, a left-aligned logo, and a colored background. The logo and background must also be enclosed in a border. Something like this: The correct alignment is ...
-1 votes
0 answers
73 views
Web carousel very slow on Safari desktop, fine everywhere else [closed]
I have a web carousel on a site I built (here) that slides automatically (although you can also use controls to move through the slides manually). It works fine on all browsers, and manual controls ...
-1 votes
0 answers
43 views
Elementor Pro 3.32 Reduced Motion Preference
In Elementor 3.32 Pro, the builder now fully respects the user’s reduced-motion preference. This means that no Motion Effects are activated when reduced motion is enabled. I manage a school website, ...
-3 votes
0 answers
69 views
How to give a pixel wood texture to font similar to Stardew Valley? [closed]
I'm currently working on my bachelor's project, I downloaded the Stardew Valley Title font to use it in my Web Game but I'm having problems getting that wooden texture. Here is how my title related ...
0 votes
0 answers
44 views
Double highlight in Flutter Web
When highlighting texts in Textfield => It shows two highlights and when scrolling, the other highlights remain at the same position When highlighting texts: When scrolling: This only happens on ...
-3 votes
0 answers
41 views
The Selector comes after @apply doesn't work [closed]
When I try to write a selector after been use @apply that selector doesn't work. For Example: @layer components { .icon { @apply p-1 hover:bg-gray-200 rounded hover:cursor-default; } ...