Skip to main content

Harshal V. LADHE

All Content Tagged CSS

All content tagged with CSS, covering topics from layout to styling, properties, and modern specifications.

Content tagged css

  • Post:CSS Cascade Layers (@layer): End Specificity Wars in Large Codebases

    Control CSS priority with layer order, not specificity.
    Learn how CSS cascade layers (@layer) set priority by layer order instead of specificity — unlayered styles, the !important reversal, revert-layer, layering third-party CSS, the full cascade sort order, migrating a large codebase and putting utility classes last.
    Published at:
    Categories:CSS
    Estimated reading time:20 min read
  • Tutorial:Colouring a CSS text-overflow Ellipsis Separately from Its Text

    Give truncated text's ellipsis a colour of its own.
    Change the colour of a CSS text-overflow: ellipsis without faking it — the dots take their styles from the truncating container, so an inline span can colour the text separately. Covers the truncation basics, flex and grid items, multi-line line-clamp, detecting truncation in JavaScript, accessibility and common pitfalls.
    Published at:
    Categories:CSS
    Estimated reading time:11 min read
  • Tutorial:Styling a <select> Dropdown with CSS appearance: base-select

    Style a real select's dropdown, options and arrow.
    appearance: base-select opts a native <select> into a fully styleable mode — rich HTML in options, <selectedcontent> in the closed button, and ::picker(select), ::picker-icon and ::checkmark for the dropdown, arrow and tick — while keeping its keyboard support, accessibility and form behaviour, with a plain select as the fallback.
    Published at:
    Categories:CSS
    Estimated reading time:8 min read
  • Tutorial:Animate and Type-Check CSS Variables with @property

    Give CSS custom properties real types so they animate.
    Register CSS custom properties (CSS variables) with @property — a syntax, an inherits rule and an initial value — so they animate in transitions and keyframes, fall back safely on invalid values and always have a default. Covers rotating gradients, counting numbers and per-axis motion, CSS.registerProperty(), performance, browser fallbacks and common pitfalls.
    Published at:
    Categories:CSS
    Estimated reading time:6 min read
  • Tutorial:HTML Attributes as Real CSS Values with Typed attr()

    Read HTML attributes as CSS colours, lengths and numbers.
    Typed attr() reads an HTML attribute as a real CSS value — type(<color>), type(<integer>), a unit like % or px, or raw-string — for any property on any element, not just text in content. Covers fallbacks for missing or invalid values, patterns for layout, transitions and view transitions, safe fallbacks in browsers without support, and when a custom property is the better choice.
    Published at:
    Categories:CSS
    Estimated reading time:10 min read