CODEWITHSUNDEEP
csstwitter-bootstrapless
ricardocaldeira
ricardocaldeira

Reputation: 699

Trouble outputting font property using less variables

I'm using twitter bootstrap with less and I have the following:

@serifFontFamily: 'Droid Serif', "Georgia", Times, serif;
@baseFontSize: 100%/1.5;

font: @baseFontSize @serfiFontFamily;

it produces:

font: 66.666666667% 'Droid Serif', "Georgia", Times, serif

but I want to output this:

font: 100%/1.5 'Droid Serif', "Georgia", Times, serif

Any tips?

Upvotes: 0

Views: 2820

Answers (2)

Christoph Leiter
Christoph Leiter

Reputation: 9345

You can use

@baseFontSize: ~"100%/1.5";

and less will interpret it as a string and not as an expression.

Upvotes: 4

ricardocaldeira
ricardocaldeira

Reputation: 699

I had decomposed the property font in 3 properties:

font-size: @baseFontSize;
font-family: @baseFontFamily;
line-height: @baseLineHeight;

and my variables:

@baseFontSize:          100%;
@baseFontFamily:        'Droid Serif', "Georgia", Times, serif;
@baseLineHeight:        1.5;

than it works properly!

Upvotes: 1

Related Questions