Category "css"

How to make Slick swipeToSlide vertically?

I'm trying to make a navigation vertical carousel compatible with IE11 i'm using slick library for the carousel, i'm having some issues with swipeToSlide option

CSS layout, flexbox

The "red" div (seen in the image) is in the "head" div. I'm using flexbox to positioning simply like that: #head { display: flex; justify-content: center;

issue with text characters wrapping around underlying image instead of overlapping

I have two overlapping elements using relative positioning. A block of text overlaps an image behind the text block element. I can get the elements to overlap b

Create Close-up Half Circle in HTML CSS

I was ask to create half circle-like design for my project in html css , its look like this : Figma Design but it really ""zoomed"in. i tried to make it and the

Enabling scroll using Tailwindcss

I am using Tailwindcss and trying to achieve a design, in which there is a scroller in middle section. However, the scroller is disabled and it's full height i

Unable to positioned the webgl canvas while capturing image

I'm accessing the webcam and trying to take a picture. this is what it looks like before capturing the pic. But this is what I'm getting after taking the pictu

How to fade smoothly between gradients in JavaScript

This code populates a div with a predefined set of gradients and fades through them in a cycle using jQuery's .animate() method: /// Background Gradient Cyc

How to style child elements with vanilla extract?

I am starting to use vanilla extract to style a NextJS app. Is there any way to style child elements from the parent without creating another class? I have an s

How to configure a site-specific custom caret color for Dark Reader?

For script.google.com, I can make the entire page site dark, but when I do, I cannot see the cursor/caret. I've found the developer tools for Dark Reader, but

Adding shine animation not working in special cases

I have this function to shine any text element which is passed to it. The first example here works fine (the second example doesn't work, I provide this in case

Overriding element's css in Nebular/Angular

So I am trying to change the css of the header element of the nebular theme in angular It looks like so I want it to look like this I am trying to separate the

Command removing tailwindcss in the input.css

When I run: npx tailwindcss -i ./src/input.css -o ./dist/output.css --watch My output.css gets mostly deleted, and only contains a handful of tailwind css, see

Stylesheet renders in grover debug but not on downloaded pdf

I'm using Grover to render and download pdf copies of documents that are generated in my app and am having trouble applying css to it. When in grover's debug m

How to target a styled component inside another styled component?

Instead of using div:first-child or div:nth-of-type(2) I would like to say Row or ColSm3 like we usually do in normal CSS, Is it possible to target a styled com

How to set a background image for all pages in reactjs

I tried to set a image to all pages as background. I have tried to set the style of the body tag of index.html <body style="background-image: url(%PUBLIC_URL

How do I randomly change an HTML element on a timer using Javascript - across the web, not just within the browser?

I'm creating a website with HTML, CSS, and JavaScript. I have a picture element on my page, among other elements. What I want to achieve is to randomnly change

How to make a Chakra ui react theme drawer have a closeButton icon that aligns to the beginning of the drawer

I'm following this Chakra Doc on how to create a drawer slideout menu: https://chakra-ui.com/docs/overlay/drawer using the following component: import React fro

Fieldset legend CSS rendering behavior has changed in recent months... what happened?

I have a form with various nested <fieldset> elements, each with a <legend>, and today I noticed an error in my web page on all the browsers I've ch

Setting CSS pseudo-class rules from JavaScript

I'm looking for a way to change the CSS rules for pseudo-class selectors (such as :link, :hover, etc.) from JavaScript. So an analogue of the CSS code: a:hover

How to Change Color of Knob in Bootstrap 5 Switch

So i want to change the knob color to match my color theme. But when i open the bootstrap.css, i could not find the reference to that. I can change the border a