<div class="u-float-lft">
Floting left.
</div>
<div class="u-float-rgt@md">
Floting right on tablet.
</div>
<div class="u-float-rgt u-float-none@md">
Floting right on mobile, do not float from tablet onward.
</div>
<div class="u-float-lft">
Floting left.
</div>
<div class="u-float-rgt@md">
Floting right on tablet.
</div>
<div class="u-float-rgt u-float-none@md">
Floting right on mobile, do not float from tablet onward.
</div>
{
"label": "Lorem ipsum",
"labelLong": "Lorem ipsum dolor sit amet",
"htmlText": "<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer varius tincidunt purus at laoreet. Sed congue sollicitudin lacus vitae porttitor. Integer convallis maximus odio eget.</p>",
"text": "Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer varius tincidunt purus at laoreet. Sed congue sollicitudin lacus vitae porttitor. Integer convallis maximus odio eget.",
"linkTarget": "_self",
"url": "https://www.unibz.it",
"image": "/assets/bridge-524-295.jpg"
}
General utility classes to float (un-float) elements, the class names follow this pattern:
.u-float-<float value>@<media-query>
<display value>
none
= float: none
lft
= float: left
rgt
= float: right
<media-query>
(noting) = no media query, applies from mobile onward (all screen sizes)sm
= small tablet, applies from 596px
onwardmd
= tablet applies, from 760px
onwardlg
= desktop applies, from 1024px
onwardprint
= applies only on print media