CSS methodology: OOCSS vs. BEM [closed] - html

Closed. This question is opinion-based. It is not currently accepting answers.
Want to improve this question? Update the question so it can be answered with facts and citations by editing this post.
Closed 1 year ago.
Improve this question
Which one should I use, OOCSS or BEM, when you want to write clean CSS? Is there any reason that you may prefer to use one over the another?

At the end of the day you should know what your particular use case is and learn what works for you. Obviously if you're working for a company and they prefer one over the other you wanna go with that!
My team and I wrote out our own internal CSS namespace specifications which are based off of BEM. The reason we prefer BEM is largely because of how extremely self-documenting it can be. I can look at a class name and know everything about that class's element.
However, there's no right or wrong answer. As long as your code is self documented, clean, and easily maintainable. Use whatever standard you want.

Related

Are variables commonly used in CSS? [closed]

Closed. This question is opinion-based. It is not currently accepting answers.
Want to improve this question? Update the question so it can be answered with facts and citations by editing this post.
Closed 1 year ago.
Improve this question
Modern CSS gives us the possibility to use CSS variables that we can reference in multiple other places.
To what extent do they differ from the variables within JavaScript?
Am I more performant when I set CSS attributes or values via JavaScript, or the opposite is the case? Is that a chicken and egg story, or is there a proven way to do that?
Yes, variables are generally used when you are developing something big and you don't want to repeat your reusable colors or any other properties. But if you're just starting then I don't think it necessary to use variables more. If you want you can but not necessary.
You may also find that in frameworks like bootstrap or material css variables are declared once and used in many places.
Usage of variables makes more sense when you are using any preprocessor like Sass or less or something else.

HTML/CSS:CamelCase vs Underscores [closed]

Closed. This question is opinion-based. It is not currently accepting answers.
Want to improve this question? Update the question so it can be answered with facts and citations by editing this post.
Closed 8 years ago.
Improve this question
I have read lots of articles about advantages and disadvantages of camelCase and Underscore naming conventions. I've always prefered camelCase mainly because it saves bytes.
But learning about BEM, I've been really confused. BEM naming is more readable but '_','__' and long names add file size. Also I couldn't found any js plugins with it. So which one is better for qualified webpage?
P.S. sorry for bad English. Any opinion is appreciated
For css I can't recall I ever seen camel case (in professional work).
For me I use BEM when I work on private projects. I tend to use double underscore like .banner__image and .banner__image--large (you get it if you read the BEM specs).
At work our team use BEM with a modification though, only one underscore or hyphen (for modifiers) .banner_image and .banner_image-large.
If not using BEM you probably should write classes with a hyphen (-). Like this .banner-image and .banner-image-large. For examples you can look at Twitters bootstrap structure with class names, or any other site infact.

Is it bad practice to use inline styles? [closed]

Closed. This question is opinion-based. It is not currently accepting answers.
Want to improve this question? Update the question so it can be answered with facts and citations by editing this post.
Closed 8 years ago.
Improve this question
Is it bad practice to occasionally put some CSS directly into some HTML tags if I am sure that it won't be used again?
For instance:
<div style="padding-left: 0"></div>
Or do I have to systematically create new class even for little tweaks that will pollute my CSS file?
Yes it is fine. Stylesheets are used mostly to style multiple pages in the same manner and for easier editing. Putting css directly in html also overrides all other conflicting styles.
There is a Programmers Stack Exchange site that's a better fit for questions like this.
Here are two existing questions there that cover this particular topic:
https://softwareengineering.stackexchange.com/questions/138538/is-it-a-bad-practice-to-use-inline-styling-with-generated-code
https://softwareengineering.stackexchange.com/questions/125893/when-should-i-use-a-css-class-over-inline-styling

How to make a flowchart/diagram using only HTML and CSS [closed]

Closed. This question needs to be more focused. It is not currently accepting answers.
Want to improve this question? Update the question so it focuses on one problem only by editing this post.
Closed 8 years ago.
Improve this question
I need to make a really complicated diagram for a website, in which the hierarchy will be a bit messy: arrows will go up and down, sometimes an element will point to several others, and sometimes there will be several elements pointing to the same one. I have found this method, but it doesn't allow more than one parent for an element and therefore won't do the trick in this case.
It has to be done in HTML/CSS, because my intention is to add some Javascript to change the content of the blocks dinamically.
This is an example of the level of complexity I need to achieve:
You might want to take a look at this
http://thecodeplayer.com/walkthrough/css3-family-tree
Another to look for is SpaceTree example by "Nicolas Garcia Belmonte" but not a pure CSS solution. It is compatible with IE and most of browsers. Definitely worth a try.

Should I separate typography section from the HTML hierarchy? [closed]

Closed. This question is opinion-based. It is not currently accepting answers.
Want to improve this question? Update the question so it can be answered with facts and citations by editing this post.
Closed 9 years ago.
Improve this question
Is it a good practice to make a separate section of CSS rules applying only for typography? or should they be part of the HTML hierarchy flow?
The question is mostly from readability and maintainability point of view.
In my opinion, it's best practice to keep things modular. Put your CSS in its own file(s), and, if you have a lot of stylings (very common), I'd say you can have a typography.css to make the rules very clear. HTML is supposed to be meaningful (as the purpose of HTML5 is to go back to this idea), and this should extend past the use of tags to the placement of files and readability of your code.
Hope this helps.
There is of cource no correct answer to this question, but in my experience: both.
I feel that I gain a lot from a good css reset, and they do tend to handle some typography.
But aside from that I have yet to gain from a separate style-sheet for typography only.