Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

using inline css - a no-no or okay in certain situations? [duplicate]

Possible Duplicate:
Inline styles vs styles in CSS

i guess i'm looking for some opinions on this. I am all for using css styles as classes in a separate .css file. But every once in a while, i run into a scenario where i need just some padding for a particular element or change the css class' width only in one particular situation. Is it okay to add inline styles in those scenarios? do people do this or always create classes for everything.

My theory would be if its not something reusable or does not contain more than 2 styles, why create a class for it. Am I wrong in thinking that?

Summary of Answers (since there are many)

It is better to avoid inline styles because

1) style sheets provides more maintainability.

2) better separation of html data and layout.

3) re-usability of styles.

4) probably provides better caching.

Overall, css style sheet is the best practice.

like image 698
coder net Avatar asked Jun 17 '11 17:06

coder net


People also ask

Why is inline CSS a bad idea?

One of the main reasons that inline styling is not a good choice for your application is because it does not support (or it has really poor support) for CSS features. Every application nowadays might have to end up using some selectors such as :hover , :active , :focused , etc.

Is inline CSS OK?

Inline CSS allows you to apply style rules to specific HTML elements. Inlining CSS means putting CSS into an HTML file instead of an external CSS. Since inline CSS allows the application of a unique style to one HTML element, its usage is limited but is beneficial for creating unique attributes.

What is inline CSS and its disadvantages?

Inline CSS is used to style a specific HTML element. For this CSS style, you'll only need to add the style attribute to each HTML tag, without using selectors. This CSS type is not really recommended, as each HTML tag needs to be styled individually. Managing your website may become too hard if you only use inline CSS.

When should you use inline CSS?

An inline CSS is used to apply a unique style to a single HTML element. An inline CSS uses the style attribute of an HTML element.


2 Answers

Anything is reusable if you think it through and set it up correctly. Even one-line, one element CSS attributes can be beneficial if reused. This takes advantage of the concept of caching, which will keep the css in memory after the initial load hit. No matter which way you slice it, inline styles add to your overhead every load without question.

Never mind the fact that inline mixed with a proper css document adds overhead to your own debug time, figuring out where the darned calls are coming from.

like image 88
bpeterson76 Avatar answered Oct 11 '22 01:10

bpeterson76


Two answers to this one:

1) It's considered good practice to keep your design (css) and your data (html) separate. By adding in-line styles, it makes it more difficult to revise the look of a site, it makes it more difficult for future programmers to modify your site, and is overall NOT the best way to go.

If everything is in a CSS file(s), then you can change the entire design of your site without having to mess with the data (HTML) of the site. This is ideal.

2) Yes, a lot of people still use inline styles very often when tweaking something small, regardless of "best practice".

like image 43
Dave Avatar answered Oct 11 '22 00:10

Dave