I know that Inline CSS styling gets so much hate from many developers, and I understand that some of this hate is justified by the following facts:
- Inline styles increase page size as they don't get cashed like CSS files do. But isn't the difference in size minor in most practical cases ?
- It's hard to maintain inline CSS styles. Well I think it depends on whether the element you're styling will have a unified look across the website or is it an element that will be used only once on the website, or if you're applying styles that will only apply to this element.
I know that many developers may say that it violates the "separation of concerns" rule , because the we're styling within the HTML markup , but I have two things to complain about that claim:
Isn't in fact a method to better separate concerns when you isolate an HTML element along with its CSS in the same spot ? this way the element and all its dependencies (read CSS code) will be encapsulated.
I am not saying that we should use inline-styles all the time as there is definitely a lot of times where it make sense to use a dedicated CSS classes/files for styling elements, especially those that appear in multiple pages across the website and have the same look or almost the same look.
The reason I am asking this question is because every time I write inline CSS code I feel guilty and start thinking that the code that I wrote is bad, and most of the time end-up separating these styles that I think should be coded inline into a separate file.
Is there any reason other than the ones I already mentioned why CSS inline-styles gets hate ?
Thanks in advance.