Geetansh Sahni

Geetansh Sahni

5 Articles Published

Articles by Geetansh Sahni

5 articles

How to Set Calc Viewport Units Workaround in CSS?

Geetansh Sahni
Geetansh Sahni
Updated on 15-Mar-2026 459 Views

The CSS calc() function performs mathematical calculations to be used as property values. It's particularly useful for creating responsive layouts by combining different units like viewport units (vw, vh) with fixed units (px) to create workarounds for viewport-based calculations. Syntax selector { property: calc(expression); } Supported Operations The calc() function supports the following mathematical operations − + Addition − Subtraction * Multiplication (at least one argument must be a number) / Division (the right-hand side must be a number) Important Rules The + and ...

Read More

How to make an area unclickable with CSS?

Geetansh Sahni
Geetansh Sahni
Updated on 15-Mar-2026 20K+ Views

To make an area unclickable with CSS, we can use various CSS properties. This article covers three different approaches to disable click interactions on specific areas of a webpage. Syntax /* Method 1: Using pointer-events */ selector { pointer-events: none; } /* Method 2: Using z-index overlay */ .overlay { position: absolute; z-index: higher-value; } /* Method 3: Using transparent div */ .transparent-overlay { position: absolute; background-color: transparent; } Method 1: Using pointer-events ...

Read More

How to disable a href link in CSS?

Geetansh Sahni
Geetansh Sahni
Updated on 15-Mar-2026 7K+ Views

To disable a href link in CSS, we can use various approaches keeping the link visible but preventing user interaction. We will be understanding three different approaches to disable a href link in CSS. In this article, we are having a link as 'Click Here', our task is to disable href link in CSS. Syntax /* Method 1: Using pointer-events */ a { pointer-events: none; } /* Method 2: Using z-index */ a { position: relative; z-index: -1; } /* Method 3: ...

Read More

How to Create Text Reveal Effect for Buttons using HTML and CSS?

Geetansh Sahni
Geetansh Sahni
Updated on 15-Mar-2026 2K+ Views

In this article, we will discuss the approach to creating text reveal effect for buttons using HTML and CSS. Buttons are the most important user interface component for any website. It is very important to design the buttons in a creatively unique way. The text reveal effect for a button is used when it is used to reveal some offer or exciting content for enhancing the user experience. The approach is to cover the button with a strip of the same dimension as of button and then moving it in any one direction on mouse hover. Syntax ...

Read More

How to Create Link Tooltip Using CSS3 and jQuery?

Geetansh Sahni
Geetansh Sahni
Updated on 15-Mar-2026 1K+ Views

Link tooltips are an excellent way to display additional information when users hover over links. This article demonstrates three different approaches to creating tooltips using CSS3 and jQuery. Approaches We will explore the following methods − Using jQuery mouseenter and mouseleave functions Using jQuery UI tooltip() function Using pure CSS for tooltips Method 1: Using jQuery mouseenter and mouseleave Functions This approach uses jQuery event handlers to show and hide tooltips dynamically. The mouseenter event fires when the mouse enters an element, while mouseleave fires when it exits. Syntax $(selector).mouseenter(function() ...

Read More
Showing 1–5 of 5 articles
« Prev 1 Next »
Advertisements