What is the best practice to normalize CSS? [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 9 years ago.
Improve this question
I have been looking around the internet for the best way to normalize my website CSS.
I have read about:
Conditional Stylesheets;
CSS Reset;
Normalize.css;
Initializr;
HTML5Boilerplate;
I know that last two have a lot of other features, but they are also give you some CSS normalization.
I'm more bend to Normalize.css, since seems to be only and exactly what I need, but I would like to have more opinions.
Best regards!

normalize.css is the way to go most likely. reset.css is intended to strip all of the default styles completely to their bare minimum (so for example h1 and h2 and the rest of the headings all have the same style) while normalize.css is more of a bare-bones but functional css reset (so you still have basic style differences, e.g. font size between h1 and h2 and so forth).
I believe initializr and HTML5BP use implementations of normalize.css.

Related

Is it best practice to use * {box-sizing: border-box} in 2016 HTML websites? [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 6 years ago.
Improve this question
Just like the titles is saying, is it best practice to use {box-sizing: border-box} in 2016 HTML websites? And if yes, how do I implement it to use on all browsers (Mozilla, Chrome, Safari...)? I saw this:
on http://www.html5xcss3.com/2013/07/10-basic-tips-to-design-a-responsive-website.html
Which made me think about that ;)
Personally, I'd say no -- blanket solutions using the universal selector (*) are almost never a good idea. Doing something like * { box-sizing: border-box; } applies that style to every single element on the page. I've seen use of * styles have unwanted effects on certain types of elements, like form inputs and buttons. Sometimes the unwanted side-effects are different in different browsers.
By the time side effects crop up in a large enough project, switching to a more conservative approach may require extensive CSS edits and browser testing. For that reason, I favor going with something like normalize.css or Eric Meyer's reset + Formalize.
Years of wrestling with browser incompatibilities and quirks, sometimes creating my own self-imposed CSS hells along the way, have caused me to mostly favor constrained solutions. Less chance of unpleasant surprises that way.

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

Why i should use float instead display:table-cell? [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 am converting a PSD to html but i am little confused about float, i can use here display:table-cell; instead float for navigations, and other links. is there any standard to picking the CSS property.
There are a whole host of different CSS layout strategies you can consider, and each have their own strengths and drawbacks. Floats work in every browser, down to and including IE6. Table Display only works in IE8+. It’s also not widely used because it tends to require a lot of markup to get the same effect as a simple float layout.
Most integrations require a combination of layout strategies, including absolute positioning and floats. If you aspire to be a web designer, I’d suggest you start with these.

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.