kreut — 2012-06-13T08:59:52-04:00 — #1
To create a cohesive site one would expect the styling to be uniform throughout. As we all know, external style sheets can greatly facilitate this since every item with the same class can quickly be changed; in addition, since external style sheets are cached, the pages will load quicker. We're also told that inline styles aren't so good to use.
However, doesn't every single forum use inline styles (including this one)?
For example, on this page, I'm using this font, then this comic fontand then
centering my text.
: all defined in-line.
With this in mind, would it be "sooooo bad" to have a website that has a "healthy" combination of external style sheets and some inline styles on each page?
I appreciate your thoughts...
ralphm — 2012-06-13T09:07:26-04:00 — #2
Inline styles are just really inefficient. If you have to write the same one twice, you've kind of missed the point of CSS. You might as well just be using presentational HTML (from the 1990s). If you only use a style once, then fair enough. But using the same inline style more than once means that, if you want to change the style, you'll have to change it in many places.
chris_upjohn — 2012-06-13T09:33:04-04:00 — #3
kreut — 2012-06-13T09:40:22-04:00 — #4
Thank you for your response to this post and to the other one that I just made regarding fields/buttons and WYSIWIG editors.
After a quick look at the CKEditor, I see that it supports both fields and styles so that I can define them the efficient way.
Enjoy your week,
kreut — 2012-06-13T09:45:28-04:00 — #5
paulob — 2012-06-13T10:34:50-04:00 — #6
You may occasionally need to use inline styles if you have content say that comes from a database and you need to size the element depending on the amount of content that you need to show. The easiest way would be to calculate the width serverside and then insert an inline style with serverside code to set the appropriate dimensions.
On one site I did there was a progress bar that was styled with css and to update the width of the progress bar the width from 1% - 100% was written directly into the tag using an inline style <div style="width:50%">Progress bar</div>. The width was only known at runtime when the progress data was received from the database. The inline style was thus easier than setting up 100 classes for every width from 1% to 100%.
However, barring those types of scenarios there is little need to use inline styles. (The ones you see in the forum code are probably because of dynamic changes and inserted when run and not by default or because of functions similar to the ones that I described above.)
dresden_phoenix — 2012-06-13T12:32:37-04:00 — #7
Nothing is absolute... but ralph's point about inefficiency is is key reason. Paul's example echoes that, in reverse.. there are rare cases when inline is more efficient than 100 classes. In addition, there are specificity issues it might cause if you were to mix box techniques will-nilly. There is also the idea of ease of maintenance, its easier to make a stylistic change w/o having to sift through all your markup.
kreut — 2012-06-14T10:44:26-04:00 — #8
Thanks all for your comments, they've been very helpful...
mani0993 — 2012-06-18T08:36:41-04:00 — #9
It's not bad. But jQuery or normalized CSS styling is preferred over inline styles. However, it's good to avoid inline styling as much as possible.