Web Development Articles

Page 565 of 801

How to Make Scrollbar Custom Arrows Work on Mobile Devices?

Yaswanth Varma
Yaswanth Varma
Updated on 15-Mar-2026 2K+ Views

Custom scrollbars can enhance the visual appeal of your website by providing a unique user experience. While modern browsers support custom scrollbar styling through WebKit CSS properties, making these work consistently across mobile devices requires specific techniques. Syntax ::-webkit-scrollbar { width: value; } ::-webkit-scrollbar-thumb { background: color; } ::-webkit-scrollbar-track { background: color; } WebKit Scrollbar Properties PropertyDescription ::-webkit-scrollbarStyles the overall scrollbar element ::-webkit-scrollbar-thumbStyles the draggable part of the scrollbar ::-webkit-scrollbar-trackStyles the background track of the scrollbar ::-webkit-scrollbar-buttonStyles the arrow buttons on ...

Read More

How To Create A Text Inside A Box Using HTML And CSS

Yaswanth Varma
Yaswanth Varma
Updated on 15-Mar-2026 26K+ Views

To create a text inside a box using HTML and CSS, we can use several approaches to add borders around text elements and create visually appealing boxed content. Syntax selector { border: width style color; padding: value; } Approaches to Create a Text Inside a Box Using span element with CSS Using CSS flexbox Method 1: Using Span Element with CSS Border This method uses a element with CSS border and padding properties ...

Read More

How to Make a Shape Like On Image in Pure CSS?

Yaswanth Varma
Yaswanth Varma
Updated on 15-Mar-2026 1K+ Views

Creating custom shapes in CSS allows you to break free from the traditional rectangular box model. You can use the CSS clip-path property along with various shape functions to create visually appealing designs that clip portions of elements to form different shapes. Syntax selector { clip-path: shape-function(parameters); } Using Border Radius for Organic Shapes You can create irregular shapes by applying different border radius values to each corner of an element − .organic-shape { ...

Read More

How to Get this Text-Wrapping Effect With HTML/CSS?

Yaswanth Varma
Yaswanth Varma
Updated on 15-Mar-2026 895 Views

The CSS word-wrap property allows long words to be broken and wrapped onto the next line when they exceed the width of their container. This prevents text overflow and ensures content remains within the designated boundaries. Syntax selector { word-wrap: normal | break-word | initial | inherit; } Possible Values ValueDescription normalWords break only at normal break points (default) break-wordAllows unbreakable words to be broken initialSets to default value inheritInherits from parent element Example 1: Text Wrapping Around Images The following example demonstrates text wrapping around ...

Read More

How to style a select dropdown with only CSS?

Tapas Kumar Ghosh
Tapas Kumar Ghosh
Updated on 15-Mar-2026 282 Views

The element creates dropdown lists for forms, but its default appearance is limited. While complete customization of native select elements has restrictions, we can apply various CSS properties to improve their styling and create visually appealing dropdowns. Syntax select { property: value; } select option { property: value; } Key Properties for Select Styling PropertyDescription appearanceRemoves default browser styling borderControls border style and thickness border-radiusAdds rounded corners paddingControls internal spacing background-colorSets background color font-sizeControls text size Example: Basic Select Styling ...

Read More

Which table property specifies the width that should appear between table cells in CSS?

Shubham Vora
Shubham Vora
Updated on 15-Mar-2026 585 Views

In HTML, a table contains columns and rows. The table cells don't contain space between two cells by default. If we add some space between table cells, it can improve the UI of the table. In CSS, the border-spacing property adds space between table cells. We need to use the border-collapse CSS property with the separate value while using the border-spacing CSS property. Syntax table { border-collapse: separate; border-spacing: value; } Possible Values ValueDescription lengthSpecifies spacing in px, em, rem, etc. length lengthFirst value ...

Read More

Which property specifies the width of a border in CSS?

Shubham Vora
Shubham Vora
Updated on 15-Mar-2026 391 Views

In CSS, the border-width property specifies the width of a border. You can set uniform width for all sides or specify different widths for each side of an element. Syntax border-width: value; border-width: top right bottom left; border-width: top-bottom left-right; Method 1: Using border-width Property The border-width CSS property allows you to define the width of borders. You can pass one to four values to control different sides − Example: Uniform Border Width The following example sets a 5px border width for all four sides ? ...

Read More

Which property specifies the distance between nearest border edges of marker box and principal box?

Shubham Vora
Shubham Vora
Updated on 15-Mar-2026 276 Views

The CSS marker-offset property specifies the distance between the nearest border edges of the marker box and the principal box. The marker refers to the bullet points or numbers in lists. However, it's important to note that this property was deprecated and removed from CSS specifications due to limited browser support. Important: The marker-offset property is obsolete and no longer supported in modern browsers. For similar functionality, use padding-left or margin-left on list items instead. Syntax selector { marker-offset: value; } Example 1: Unordered List with Marker Offset ...

Read More

Which property is used to underline, overline, and strikethrough text using CSS?

Shubham Vora
Shubham Vora
Updated on 15-Mar-2026 478 Views

In CSS, the text-decoration property is used to underline, overline, and strikethrough the text. Underlining the text means drawing a line below the text, and overlining the text means drawing a line above the text. Striking through the text means drawing a line on the text to show text is crossed out or erased. In this tutorial, we will learn to use the different values of the text-decoration CSS property to style text differently. Syntax text-decoration: decoration-line decoration-style decoration-color decoration-thickness; Possible Values PropertyValuesDescription decoration-lineunderline, overline, line-throughType of decoration decoration-stylesolid, dotted, dashed, ...

Read More

Which property is used as shorthand to specify a number of other font properties in CSS?

Shubham Vora
Shubham Vora
Updated on 15-Mar-2026 283 Views

The CSS font property serves as a shorthand for specifying multiple font-related properties in a single declaration. Instead of writing separate properties for font-style, font-weight, font-size, line-height, and font-family, you can combine them all using the font property. Syntax selector { font: font-style font-weight font-size/line-height font-family; } Values PropertyDescriptionExample Values font-styleSpecifies the style of the fontnormal, italic, oblique font-weightSpecifies the weight (boldness) of the fontnormal, bold, 100-900 font-sizeSpecifies the size of the fontpx, em, rem, % line-heightSpecifies the line height (optional)normal, numbers, px, em font-familySpecifies the font familyArial, serif, ...

Read More
Showing 5641–5650 of 8,010 articles
« Prev 1 563 564 565 566 567 801 Next »
Advertisements