Yes, CSS is a hot mess for a few reasons that all basically boil down to historical baggage.
CSS was designed for an era where the web was made of documents, probably closer to the environment of a modern ebook than a modern web app. In an ebook, you might want to set your fonts and spacings and so on, maybe even throw in a table or two, but the idea of "I want this box to appear exactly here"... well, you don't even know where here is! The paper size might be different, or the user might have custom fonts, or who knows what. The goal wasn't fine-grained control over visual design, but consistency across an organisation's published material.
Of course, "fine-grained control over visual design" is exactly what everyone wanted, even in the early days, so CSS grew in features and scope until today we have this decades-tall stratified monument to the art of pleasing everybody: a fully-featured typesetting, layout, visual design, animation and user interface language. But, however rich its top layers, the whole thing rests on a base of document publishing, and that can't be changed because You Can't Break The Web.
HTML has this problem also, which is why so many sites look like . In truth, the whole modern web is built on hacks that pretend apps are documents. A lot of that hackery (React, Vue, etc) is incredibly clever and sophisticated, but it's hacks all the same, and it only exists because the web is an app platform that wasn't built for apps. This hits CSS hardest because developers solve developer problems, and design isn't a developer problem. Unlike the DOM, the CSSOM isn't yet swaddled in enough layers of JS to fit in app world. That said, check out the various "CSS-in-JS" projects for some valiant attempts in progress.
I would say if you really want to really get CSS, you should start by using it as it was intended, typesetting simple documents with only CSS1 features (check it out, https://www.w3.org/TR/CSS1/ is so simple it makes your heart sing). Then work your way up through CSS2's additions, especially the positioning stuff (https://www.w3.org/TR/2008/REC-CSS2-20080411/changes.html#q1). Only once that feels coherent should you drink deep from the firehose: https://www.w3.org/TR/css-2018/#css
Or you could do what the rest of us do and pretend CSS makes sense while only using carefully-memorised avoid-the-dragons patterns, copy-pasting stuff from css-tricks, and fiddling with the result in the web inspector until it works. And, meanwhile, pray for Houdini: https://houdini.glitch.me/