@citizensadvice/floats
v1.0.3
Published
Pushes the element to either the left or right side.
Downloads
11
Keywords
Readme
Floats
Pushes the element to either the left or right side.
Classes
.float-left {
float: left;
}
.float-right {
float: right;
}
.float-none {
float: none;
}
Responsive float classes
To apply specific classes at set screen widths, use the following classes:
| Class name | Description |
| --------------------- | ------------------------------------------- |
| [aboveClassName]-ns
| Screens with a min-width of 48rem
|
| [aboveClassName]-m
| Screens with widths from 48rem
to 64rem
|
| [aboveClassName]-l
| Screens with a min-width of 64rem
|
Examples
<div class="float-left float-right-ns float-left-l">...</div>
<div class="float-none float-left-ns">...</div>
Installation
$ npm install @citizensadvice/floats
now import into your stylesheet...
@import '@citizensadvice/floats/index.scss';
You can also make use of the unpkg service, try adding the link below to the head of your HTML
file
<link src="https://unpkg.com/@citizensadvice/floats@latest/build/floats.css" />