CODEWITHSUNDEEP
cssresponsive-designless
spinners
spinners

Reputation: 2679

Set up responsive style sheet in less?

I would like to set up a responsive skin suing less. But I would like to use rems for mobile and px for desktop.

How do I do this?

Thanks

Upvotes: 0

Views: 44

Answers (1)

Christoph
Christoph

Reputation: 51201

Since you are using less, you don't necessarily need to distinguish those, you can just use the fallback notation via a mixin:

// the size of your base element
@base-size: 16px;

div {
    .font-size(18px);
} 

.font-size(@size){
  font-size: unit(@size,px);
  font-size: unit(@size/@base-size,rem);
}

compiles to:

div {
  font-size: 18px;
  font-size: 1.125rem;
}

Upvotes: 2

Related Questions