CODEWITHSUNDEEP
cssless
dotnetnoob
dotnetnoob

Reputation: 11330

How to access a variable outside of a media query?

Using Less.

I want to be able to use a variable globally throughout my classes.

Let's say the variable is @globalPadding;

I want to set the size of padding using media queries, like this:

@media (min-width: @4ColMin) {

    @globalPadding:@4colPadding;
}

And in my class, simply use it like this: padding-top:@globalPadding;

Is this possible using Less, and if not, are there any o ther techniques I could use to acheive the same thing?

Upvotes: 1

Views: 62

Answers (1)

Rudi
Rudi

Reputation: 2995

This is one way:

@paddingSmallScreen: 20px;
@paddingBigScreen: 40px;

.my-class {
    padding: @paddingSmallScreen;

    @media (min-width: @4ColMin) {
        padding: @paddingBigScreen;
    }
}

Upvotes: 1

Related Questions