fieldset-legend v1.0.0

fieldset-legend from PropJockey

fieldset legend's border knockout behavior for any elements - 100% CSS, no JavaScript.

The limiting feature support required to use this utility is timeline-scope.

Container style queries are also required.

Reasonable fallback behavior is included for browsers that do not support these features.

Installation and Setup

$ npm install fieldset-legend

Then include /node_modules/fieldset-legend/fieldset-legend.css

OR Use your favorite NPM CDN for small projects

From html:

<link rel="stylesheet" type="text/css" href="https://unpkg.com/fieldset-legend@1/fieldset-legend.css">

or directly from your CSS:

@import url(https://unpkg.com/fieldset-legend@1/fieldset-legend.css);

Usage

A full write up and several demos are available here:

https://dev.to/janeori/100-css-s-border-knockout-behavior-for-any-element--4b7b

Open Contact 👽

Please do reach out if you need help with any of this, have feature requests, want to share what you've created, or wish to learn more.

PropJockey.io	CodePen	DEV Blog	GitHub	Mastodon

🦋@JaneOri.PropJockey.io

𝕏@Jane0ri