We can style elements using simple Math with CSS3 property calc  property. We can define one element width by using arithmetic operations like Addition, Multiplication, Division.

### Using calc :

Lets define HTML elements left property with CSS3
left : calc(50% + 100px); (Addition)
left : calc(50% - 100px); (Subtraction)
left : calc(25% * 2); (Multiplication)
left : calc(25% / 2); (Division)

### Using SASS :

Lets use SASS for high level Math operations. SASS provides some interesting Math functions for styling elements.
pi()
sin(\$number)
cos(\$number)
tan(\$number)
logarithm(\$number, \$base)
sqrt(\$number)
pow(\$number, \$exponent)

Now I will arrange HTML elements on Circle with Trigonometry

Formula for Circle in Trigonometry :
X = X - Coordinate
Y = Y - Coordinate
X = R cosθ
Y = R sinθ

#### HTML markup of 12 div elements :

```<div></div>
<div></div>
<div></div>
......9 more divs
```

#### SASS code :

This below code will apply Left and Top positions based on nth-child property.

```\$class: div !default

\$angle: 30deg

@for \$i from 1 through 12
#{\$class}:nth-child( #{\$i} )

div
width : 10px
height : 10px
border : 1px solid #ccc
position : absolute
background-color : #ff0000```

#### Demo :

1. 2. I love your creativity. Are you also searching for engineering assignment help UK? we are the best solution for you. We are best known for delivering quality essay writing services to students without having to break the bank

## Blogroll Srinivas Dasari find me on facebook follow me on twitter