I am facing an issue in accessing the current margin-left CSS property of the class .circle in the code snippet below. A demonstration of this problem can be found on a website called PLUNKr.
The reason I need to access this property is because I have to make adjustments to a property binding calculation on mobile, which relies on the left-margin.
Below is a breakdown of what I have implemented:
<div class="circle" [ngStyle]="{'width': calcCircleWidth()}"></div>
.circle {
margin: 40px 20px;
}
private calcCircleWidth(): string {
var html: HTMLElement = (<HTMLElement>document.querySelector('.circle:first-child'))
...
}
This is what I find when I track the properties of var html: HTMLElement:
html \\ <div class="circle" _ngcontent-iai-1="" style="width: 50%;">
html.style \\ CSS2Properties { width: "50%" }
html.style.marginLeft \\ (nothing)