Live data from Hacker News

MVP.css – Minimalist stylesheet for HTML elements

andybrewer.github.io

51–60 of 122 posts

Re: MVP.css – Minimalist stylesheet for HTML elements

#53

Not putting your page header and footer inside the element is a giant pain in the ass. Both ways are semantically correct and accessible, but putting them inside the main gives you more flexibility to control your page margins/padding for various display sizes and lets you set up a grid for the whole page.

But putting the `` and `` inside the `` element is not semantically correct. If it would be, you wouldn't need ``. That's exactly why there's a very basic limit to classless CSS frameworks.

Re: MVP.css – Minimalist stylesheet for HTML elements

#54
post #12

i collect these CSS frameworks for fun! here's my list: ### Drop-in CSS Frameworks preview some of these with https://sites.yax.com/ - [Spectre.css]( https://picturepan2.github.io/spectre/getting-started/instal... ) - https://latex.vercel.app/ - https://purecss.io/ - https://picocss.com/ - https://gdcss.netlify.app/ (inspired by UK design system) - https://simplecss.org/demo - https://ajusa.github.io/lit/ - https://s…

My go to seems to not be in your list yet:

https://newcss.net

I always use this if I need to quickly make some structured info visible on the web. Works on mobile, works in dark mode, looks inoffensive and professional and is super small.

Re: MVP.css – Minimalist stylesheet for HTML elements

#55
post #12

i collect these CSS frameworks for fun! here's my list: ### Drop-in CSS Frameworks preview some of these with https://sites.yax.com/ - [Spectre.css]( https://picturepan2.github.io/spectre/getting-started/instal... ) - https://latex.vercel.app/ - https://purecss.io/ - https://picocss.com/ - https://gdcss.netlify.app/ (inspired by UK design system) - https://simplecss.org/demo - https://ajusa.github.io/lit/ - https://s…

> https://chr15m.github.io/DoodleCSS/ hand drawn look Just found the stylesheet for my website's redesign, thank you :) I'm surprised that Tacit is missing from the list though. When it comes to modern design using classless CSS my order of preference is normally water.css, tacit, and then MVP.css. It just looks great and uses the HTML5 semantic elements to their full potential.

well, i just added it :)

Re: MVP.css – Minimalist stylesheet for HTML elements

#56
post #12

i collect these CSS frameworks for fun! here's my list: ### Drop-in CSS Frameworks preview some of these with https://sites.yax.com/ - [Spectre.css]( https://picturepan2.github.io/spectre/getting-started/instal... ) - https://latex.vercel.app/ - https://purecss.io/ - https://picocss.com/ - https://gdcss.netlify.app/ (inspired by UK design system) - https://simplecss.org/demo - https://ajusa.github.io/lit/ - https://s…

My go to seems to not be in your list yet: https://newcss.net I always use this if I need to quickly make some structured info visible on the web. Works on mobile, works in dark mode, looks inoffensive and professional and is super small.

yup, i have it under https://github.com/xz/new.css but noted!

Re: MVP.css – Minimalist stylesheet for HTML elements

#57
post #12

i collect these CSS frameworks for fun! here's my list: ### Drop-in CSS Frameworks preview some of these with https://sites.yax.com/ - [Spectre.css]( https://picturepan2.github.io/spectre/getting-started/instal... ) - https://latex.vercel.app/ - https://purecss.io/ - https://picocss.com/ - https://gdcss.netlify.app/ (inspired by UK design system) - https://simplecss.org/demo - https://ajusa.github.io/lit/ - https://s…

The problem with some of these is that they are terrible for accessibility. There is extremely low contrast, missing focus styling, invalid non-semantic HTML, ... Having a list of good examples only would be much more interesting than a list of everything.

Re: MVP.css – Minimalist stylesheet for HTML elements

#60

Previous discussions: • https://news.ycombinator.com/item?id=25167928 (21 November 2020, 82 comments) • https://news.ycombinator.com/item?id=22681270 (25 March 2020, 91 comments) —⁂— > No class names, no frameworks, just semantic HTML and you're done. The trouble with this claim is that MVP.css abuses semantic HTML badly, using completely inappropriate elements all over the place (e.g. aside for cards, and b/strong/i…

I have to say I'm on the fence on this.

On the one hand, in the first instance it seems a lot easier to remember the syntax.

But thinking about it for longer, I realise that actually if I'm having to learn to put an inside a for a card, but an inside an becomes a callout, then perhaps it's not quite as intuitive as it seems, and if I have the mental overhead of remembering all that, perhaps I might be saving myself more energy just to write a CSS class.

One framework I've used recently which floats in between these two is Bonsai.css. It does quite a lot 'out-of-the-box' in terms of minimising boilerplate and basic styling, and uses CSS variables as a shorthand for style properties. It's also a bit of mental overhead, but you can of course just write inline styles if you can't be bothered to learn the shorthand.

Post reply on HN