4 ms·
Can someone clarify for an old school CSS person is confused (me). What is the point of doing this: <div class="md:top-[-113px]"> Instead of this: <d
by nikisweeting 6y ago
Can someone clarify for an old school CSS person is confused (me). What is the point of doing this:
<div class="md:top-[-113px]">
Instead of this:
<div class="md" style="top: -113px">
Why would you want to inline your overrides directly in the class names instead of just using style?
- yurishimo 6y agoYour example here is actually a perfect reason. Inline styles apply all of the time. With a class, you have access to media queries and thus some basic form of logic. The “md:” prefix is used exactly for this. It applies any following class at a medium media query breakpoint. Same thing with focus or hover styles, also impossible with an inline style attribute. The custom overrides are obviously more one off and less reusable, so the difference between those and a style attribute are less obvious at first glance. With classes though, you are bound to the class names in your stylesheet and thus some form of sanitization/linting. Inline styles won’t stop you from breaking your design system.
- nikisweeting 6y agoGot it, makes sense, thanks.
- mekster 6y agoIf you have ever built a responsive design, you will not want to use "style" attribute ever.