Category "css"

How to display image horizontally in block div?

I have a grid parent block: <div class="grid"> <div><a><img></a></div> <div><a><img></a></d

How can I customize user's current website cursor with my Chrome Extension using Vanilla JS?

I'm developing this Chrome Extension for Custom Cursors, I have the SVG path that I want to apply to the website's files that the user is using. What can I writ

Position of image <input> open dialog on Safari iOS

I need to trigger browser image selection from photo library/camera in response to user clicking a custom element (hiding the default <input>). Using the

How to override Kendo grid CSS

I have following grid in vue.js. I wanna to change the grid header background and text color and hide the scrollbar according to these links: https://docs.teler

Rendering Overlay Containers when theming Angular Material?

According to this tutorial we should be able to add the class needed to render the overlay container that backs Angular Material Select, Snackbar, etc. like thi

SCSS: Getting compilation error when using grid: repeat(auto-fit, minmax(260px, 1fr));

I have valid css grid rule .grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(300px , 1fr)); } however, the scss compiler brings t

Can i incorporate CSS directly in a mustache file?

Can I can incorporate CSS such as using the " in a mustache file for a Moodle plugin? I am new to plugin and I'm still learning, any feedback is welcome.

How can I set bootstrap-vue theme colors to css variables?

I'm using bootstrap-vue and would like to be able to override the theme colors dynamically at runtime (after compiling the scss). To do this I'm following this

About implement single HTML page with multiple tabs via CSS with or without JavaScript aid

I am interested in building a web page with one single HTML file and multiple tabs. Since only one tab at a time can be selected, I thought that the most approp

How to automatically close fancybox 4 popup after x seconds?

I have a web page page.html with this fancybox4 link <a href="link.html" data-fancybox data-type="iframe" data-width="80%" data-height="25%" > I would cl

Does length of CSS code determine the loading speed of website? [duplicate]

I am beginner. I want to know, Does length of CSS code determine the loading speed of website?? Please tell me about relation of code and load

How to create a zig zag pattern using CSS

On a repeated background, the edges of the repeated tiles don't align exactly on certain zoom levels. This leads to unwanted edges as the color of the backgroun

Star and Half Star Rating in Laravel

I want to display average product ratings in star. The values are displaying good but I want to show half star if the value is in float. My blade view: <div

How to convert these inline style in html into react?

Hi Inside the html people use these kind of styles to animate. I am actually following the pen from alphadex Link. I never see this kind of writing in HTML befo

Angular 12 css fallback

Angular 12's css are generating a fallback for css's variables. How can I prevent that?

Number of sibling elements in a calculation in SCSS

I'd like to customize an animation in SCSS based on how many sibling elements the animated element has. The full SCSS code is here for reference, however the re

Make custom checkbox switch Label element a11y tab / keyboard accessible

So I'm trying to make custom slider that's cross browser (IE11, Chrome, Firefox, Edge) that's also a11y accessible and I'm having trouble getting the label elem

How to test CSS properties defined inside a class with react testing library

I am trying to test CSS properties that i have defined inside a class in css, wing the react testing library. However I am unable to do so. Adding the simplifie

@media query not working with 2 display: none; tags

I created a website and I used 2 divs, 1 has all the code for the desktop layout and one has all the code for mobile, I did this and would like to keep it this

Why are the "date" and "time" entries not displayed correctly in Google Chrome Mobile?

I have a small scheduling system that I developed (Look here). The "date" and "time" entries are showing normally in most desktop and mobile browsers: But for