Category "css"

make Hamburger Nav sticky on Scroll and responsive on all mobile media queries

I am trying to make the navbar Hamburger on mobile view responsive and sticky on scroll on 320px, 375px, and 425px screen sizes. I would like to have a solution

Using CSS border-radius (rounded corners), how can we prevent the rounded corners from disappearing if the image is scaled down (max width/height)?

Consider this scenario: An image is centered both horizontally and vertically using a flex box The image has a CSS border-radius configured (rounded corners) Th

<a /> tag with a child image opens the image in new tab instead of the <a /> tag's link when clicked

I have an anchor tag <a /> with and image as a child , basically I want to create an image that works as a link .in this case the image is a youtube thumb

How do i properly position my SVG element, so its even on resizes

So heres the image of my problem. I have two SVG files, and i want them to sticky to the bottom no matter how i resize my window, and if I resize it to a mobile

How to access element from html that is stored in variable?

I have HTML that is stored in a variable. I am trying to figure out how do I access it. Fo example if I want to get element values by id or class name or apply

How do I solve a problem with a CSS file?

I am a new user and this is my first post on StackOverflow. I wanted to try to code an Infinity RGB animation using HTML and CSS and to get the work done, I fo

flexLayout div with full width

I have a form this form takes up 1/3 of the screen adjacent to the left , so ı want to this form display with full width (occupy the entire screen from lef

Tailwind css classes not showing in Storybook build

I am trying to build my storybook with tailwind css. When running build-storybook the components are rendered with the tailwind classes. Unfortunately, when I b

How do I make stacking cards with CSS and JS?

I created the effect I want below: const container = document.getElementById("container"); const boxes = document.querySelectorAll(".box"); const clearBtn =

When i click on delete button it deletes all notes after that note where i have clicked

To run this thats why i added css and html also, What i want tnat when i click on any notes delete button that note should be deleted however it deletes other n

Bootstrap with font-weight: 500 looks "normal" on Firefox

I'm using Bootstrap and setting an element to use font-weight: 500 causes it to look medium/semi-bold in Chrome but normal-weight in Firefox on Windows: Chrome:

How to "fix" image size inside card?

I have simple section with card with image and title. How can I fix image size inside the card, so it stays the same no matter what is the actual size of the or

Use PHP to populate the images and names of the images into this slideshow code

I'm struggling to create a php gallery slideshow and was hoping someone could recommend how to do this part.. The below code is taken from w3schools and works w

How to set the icons to the bottom of each card that must be present inside the card ,for my case it's overflow and crossing the some of cards?

when onclick functionality happens on the CLOSE button it generates some cards ,each card contains some icons at the bottom that needs to be fixed position(perf

how to render a JS variable into a html element

I am new to Javascript and want to be able to display a JS variable onto my page without the user going into the console as it is neater, and I find a lot of pe

Does animate.style support on hover animation

I want to use animate.style to show animation effect on hover and not on page load, New version of animate.css which is animate.style doesn't seems to have hove

Styling Scrollbar of the modal inside reactjs-popup

I have a reactjs-popup inside my CustomPopup functional component: function CustomPopup({setFalse, item}){return(<Popup open={true} onClose={() => {setFal

Active image tab image gallary

I have a tab gallery (from W3Schools) where you can choose an image to show under. I was wondering how to have an active class for the chosen image after I choo

app.css error when compiled with ruby sass from app.scss

I'm trying to build my project with gulp, and the app.scss file is compiled with ruby sass. The problem is the app.css gets error and cannot be applied to brows

How do I add delay within a function in Javascript

I am trying to create a simple function when on click a series of style changes happen to an element. I want to add a 4-second delay in between the two style ch

Other Categories