Do you guys prefer seperate css files or inline styling?

Imagine still using css in 2018

🙈 wtf?
there is only one usecase for inlineing and that is html emails.

@Alice yeah, foundations zurb build stack is awesome makes html emails super easy. http://foundation.zurb.com/emails.h...

@Alice it's one of those jokes, where you're dead serious til you see everyone question your place on earth then you quickly say "Just kiddi g...jus..just kidding 😅"

@sharktits hell yea...i never learned Sass or Less

@heyheni zurb looks cool...dope mascot too

Separate css of course, mostly I use inline css in development phase for a quick edits.

@aitkotw I do that too. Was just wondering why is that. Would it have to do with load time?

I do all my styling with JS. I always try to maximize reflow.
Wait what...

@Holyfield3000 it's just bad practice, try to avoid inline css as much as you can

I don't USUALLY inline style, I keep a main.css file. BUT what happens is i inline style to make quick changes..then I just leave it there. But i dont start a project like "Inline...Inline styling everywhere"

@Synti I see what you did there

Didn't google recommend <style> instead of <link>?
That's the middle between inline and external file.

What's this "CSS" that you speak of?

. answer > @YADU {
background: css is short the cascading stylesheet;
width: it's widely used to style html websites;
height: you usually link a css stylesheet to the html file;
letterspacing: o k ?;
}

@Alice Can you really do that?? Never used import

And so what about component style styling (i.e. with Django you can do template tags so something like

Base.html:
<style>{% block style_block %} {% endblock %}</style>

Each html page:
{% block style_block %}
.foo {
Width:100px;
}

#bar{
color:white;
}

{% endblock %}

@heyheni i know what it is i was making a joke about using raw html

@YADU okay 😎

http://www.brutalistwebsites.com/

Is that a legit question?

@DawidCyron not anymore its not 😓

Inline as in "right in the HTML tags" sucks because one, you can't easily change that in various places, and two, it will be a headache once you implement content security policy (CSP).

Inline as in "CSS in the same file" can be useful for smallish CSS that is only used in one HTML file because it saves an http request and you can CSP around it by allowing its SHA-256 hash. It can also be fine for landing pages with reduced CSS when you prefetch the full, real CSS that is used in the other pages because it makes the initial load faster.

Otherwise, use external CSS, but try to combine them in as few files as possible because that saves requests and is cached anyway (if you specify proper cache expiration).

Styled components if I work in react. Makes much more sense to me to keep everything together. Yes we were taught to always seperate styling and markup but why? Most people cant give you a good answer, they just repeat what people told them. For standard websites either sass with bem or tailwindcss

@Fast-Nop definitely appreciate the full explanations. I'm adopting the style of a external sheet and Inline (What I call Component style styling) as far as small chunks of css used on specfic pages.

I just started caching like last month (got a problem with it, sue me! Lol) but yea. Thanks for this

@musician I just saw your comment, that's how i felt! But some of these answers got me thinking there's really a reason lol