Updated version is available (click)! π₯
Again and again one reads CSS tips and what one must consider in order to create fancy websites ...
For further actions, you may consider blocking this person and/or reporting abuse
I disagree. By resetting the styles you create uniformity between all browsers. Yes you may have to set them again, but it gives you complete control. I use a modified version of meyerweb's reset CSS, which resets, then sets key elements. Here's a link if you're curious: github.com/nataliedeweerd/blank_we...
I agree with this. To add to that using the example given in this post: a paragraph may have been designed a specific way for my project, let's say with 2em of margin at the top and bottom. I would definitely want to reflect that in my code, which means overwriting the default styling.
Yes, that's absolutely ok! :)
There exist two technics: style nullifying (
reset.css
) and definition of default styles for all browsers (normalize.css
). The second option is preferable.That's why I have noted that these are my ideas of "good" CSS. :)
But thank you for your comment, I think that many have such a view. I don't think that additional styles require resets anymore.
I think you need to reassess your concept of how much space and bandwidth things like empty selectors actually consume. First, unless you have 50+ unused selectors, you'd be unlikely to see more than a 10ms increase in download time. Css is also cached and compressed if configured properly, so the size is significantly less (0 aside from initial load). They are good points from a readability standpoint, but there are much smarter ways to optimizing performance than worrying about a few dozen characters in a css file.
I know it's only a very small fraction. But it also has something to do with clean code and helps to make it easier to read or search the code.
Anyway, thanks for your comment! :)
p.color-red
is illustrative, I can see why you've used it, but generally you want to avoid naming your styles so tightly coupled to their appearance. What if you change your colour palette? Sure changing one class name should be simple, but you don't want it littered all over the place.Using a more semantic description like
p.accent
should be preferableIt depends. Some functional CSS classes use the same name as the HTML tag name not to be used on that tag but to be used on other tags so that the display will looks the same. One example is the
.button
class. Although some controversial opinions about.button
and.btn
had emerged along with the HTML5 semantic trend in the past.Other examples:
I use
.p
class as well just to make sure that some embed code in the paragraph flow will have sufficient margin. And in my opinion, it is better than that.mt-1
and.mb-1
class name.Good point! A possibility I hadn't thought of, but it makes sense.
Oh god, WordPress themes... Current problem with the project I work on. Horrible.
Doesn't actually have anything to do with WP. It's a matter of the poor development done by whoever created the theme. You can find this problem on any platform even custom developed ones.
I'm talking (bad) themes in general. Not working with WP.
Sometimes...yes! :o
To style resets part:
You should always choose HTML tags by their semantic purpose, not by their appearance.
Naming classes based on their style such as .color-red is wrong in most cases. Stick to more semantic ones like .error-message. Ask, why should this be red, and then name it based on that.
Well I've learn htlm css in school and the teacher didn't mention the
"!Important" thing π
excelent