Include other css files into the main css

[remiwebs]

Hi,

I would like to include other CSS files in my main CSS file to keep all structured. I don't want to use @import and i would like to use the variables from an include inside another include.

Is this possible?

This is not working:

/***********************************************/
/* CSS @imports must be at the top of the file */
/* Add them above this section                 */
/***********************************************/

/****************************************/
/* HubSpot Style Boilerplate            */
/****************************************/

/* These includes are optional, but helpful. */
{% include "hubspot/styles/responsive/modules.css" %}
{% include "hubspot/styles/patches/recommended.css" %}

{% include "{{ get_public_template_url("Custom/page/Standaardisatie/responsive.css") }}" %}
{% include "{{ get_public_template_url("Custom/page/Standaardisatie/margins.css") }}" %}

/*****************************************/
/* Start your style declarations here    */
/*****************************************/

Thank you.

[EricSalvi]

Hey @remiwebs,
Out of curiosity why don't you want to use the @import option? You could do something like this,

@import url({{ get_public_template_url("Custom/page/Standaardisatie/margins.css") }});

That will work. If you want to do your include option then you could do this instead.

{% include "Custom/page/Standaardisatie/margins.css" %}

[John]

Sorry I'm a year late to the party here... Your code was wrong. Instead of

{% include "{{ get_public_template_url("Custom/page/Standaardisatie/responsive.css") }}" %}
{% include "{{ get_public_template_url("Custom/page/Standaardisatie/margins.css") }}" %}

Simply write

{% include "Custom/page/Standaardisatie/responsive.css" %}
{% include "Custom/page/Standaardisatie/margins.css" %}

Hope that helps you and anyone who finds this through Google lol!