Magento 2 CSS .less files with @variables

Question

I'm having trouble changing the max-width of a theme in Magento 2.

I've found the CSS in:

<THEME>https://waybackassets.bk21.net/css/source/_layout.less

max-width: @layout__max-width;

Then in the Magento Lib folder there is documentation for the variable:

@layout__max-width              
Default: 1280px
Allowed Values: '' | false | value
Comment: Page maximum width

So i tried adding a new definition to my _layout.less file

@layout__max-width:1185px;

Also tried adding the same definition to _theme.less file

But i'm still getting max-width of 1280px

Any ideas what i've done wrong would be greatly appreciated

Thanks

Can you please let me know the right way of modifying the less vraible, I have tried @TiEul answer but that is not working — mjdevloper, Dec 19 '16 at 6:28

Matthéo Geoffray · Answer 1 · 2016-02-16 04:20:06Z

up vote 0 down vote

You can write this code in _theme.less

@layout__max-width:1185px;

Matthéo Geoffray

1,296426

answered Feb 15 '16 at 17:21

surya

11

Hi, I've already put that code into the _theme.less file and its had no effect – Ben Feb 15 '16 at 20:02

add a comment |

TiEul · Answer 2 · 2016-08-29 15:43:22Z

Looks like you put the file in the wrong directory, the correct location is:

app/design/frontend/<Vendor>/<Theme>https://waybackassets.bk21.net/css/source/lib/variables/_layout.less

I just tried your example locally and it worked fine when I put it in the correct place.

bumped to the homepage by Community♦ 9 hours ago