Conversion Formula of width percentage Unit

Target width watermark context width = result (proportional width)

The pixel width of the current element. The pixel width of the parent element of the current element = the percentage width of the current element. 
For example: [Html]

1. <Div id = wrapper>
2. <Header>
3. <Section> </section>
4. <Aside> </aside>
5. </Div>

Original CSS: [Css]

1. # Wrapper {width: 1000px ;}
2. Header {width: 1000px ;}
3. Aside {width: 220px; float: left ;}
4. Section {width: 770px; float: right ;}

Percentage width CSS: [Css]

1. # Wrapper {width: 98%;} // specify the peripheral width. The value is random.
2. Header {width: 100%;} // set the formula 1000 limit 1000 (this 1000 is the wrapper width) = 1 = 100%
3. Aside {width: 22%; float: left;} // formula 220 rows 1000 = 0.22 = 22%
4. Section {width: 77%; float: right;} // set of formula 770 limit 1000 = 0.77 = 77%