adding custom css file priority in magento2

Question

I have added custom CSS file in custom theme with below code in

[vendor] / [theme] / Magento_Theme / layout / default_head_blocks.xml

 <head>
   <css src="css/custom.css" />      
 </head>

I want the custom.css file to load fist before the style-m.css

I tried with order="100" but that doesn't load the CSS file first.

How to make the CSS file to load first? Can anyone help me, Thank in Advance!!

PЯINCƎ · Accepted Answer · 2018-12-28 15:48:12Z

1

First, there is no order attribute, by doing this, you'll have an exception.

To place your custom.css before style-m.css, you'll need to declare it before style-m.css in your layout default_head_blocks.xml.

To place it after, you'll just need to add media="all" in xml declaration like this :

<css src="Magento_Theme:css/custom.css" media="all" />

answered Dec 28, 2018 at 15:48

PЯINCƎ

11.3k3 gold badges21 silver badges74 bronze badges

what should style-m.css contains?, I am not declared the style-m.css anywhere, it is coming from parent luma theme
– jafar pinjar
Dec 31, 2018 at 6:02
I have declared only custom.css, style-m.css load from luma, so how to declare it before?
– jafar pinjar
Jan 2, 2019 at 14:14

Add a comment |

1 Answer 1