CODEWITHSUNDEEP
csspugcalcng-styleangularjs-ng-style
zihaow
zihaow

Reputation: 322

How do properly use css's "calc()' with ng-style

I have the following inline-styling using Angular's ng-style and css's "calc()', but it didn't work. Can anyone tell me what's wrong?

// my jade file has a class named '.logo-area'. 
.logo-area(ng-style="{'right':'calc(100% -'+({{fixedWidth}}+'px') +')'}")

Upvotes: 3

Views: 16343

Answers (2)

Krishna Sagar
Krishna Sagar

Reputation: 199

This worked for me in HTML with Angular 8

[ngStyle]="{'width': someAngularVariable +'px', 'left': 'calc(100% - ' +someAngularVariable + 'px)' }"

Upvotes: 7

zihaow
zihaow

Reputation: 322

.logo-area(ng-style="{'right': 'calc(50% - '+{{fixedWidth}}+'px'+')'}")

Will solve the problem.

Upvotes: 2

Related Questions