Reusing Nested LESS Styles

Question

Say I have a style defined with Less:

ul.unstyled, ol.unstyled { margin-left: 0; list-style: none; } 

Subsequently, I want to reuse the unstyled class:

 .my-list { .unstyled; } 

However, this does not work, and I cannot understand the magic for it to work. Any thoughts?

Answer 1

You cannot reuse arbitrary class definitions, only mixins (those starting with a period). In this case, you will need to duplicate it.

Answer 2

Try the following:

 .unstyled { margin-left: 0; list-style: none; } .my-list { .unstyled; } 

You cannot embed .unstyled if it is defined as ul.unstled and ol.unstyled .

Answer 3

Since you cannot reuse .unstyled when it is a nested style, and you probably don't want to edit the Bootstrap source code, I would suggest you just assign both classes to the list:

 <ul class="unstyled my-list" />