픽셀과 퍼센트로 조종하기.

픽셀과 퍼센트 조종 방법

<div id="wrapper" style="width: 100%">

    <div id="left" style="background-color: Blue; height: 100px; float: left; width: 200px;"></div>

    <div id="right" style="background-color: Aqua; height: 100px; margin-left: 200px;"></div>

</div>

하지만 이렇게 할 경우.. 퍼센트 div에서 퍼센트로 주면 사이즈를 잘 못 읽는다 이럴때는

height: calc(100% - 18px);

It's worth it to note that not all browsers currently support the standard CSS3 calc() function, so implementing the browser specific versions of the function may be required like the following:

/* Firefox */
height: -moz-calc(100% - 18px);
/* WebKit */
height: -webkit-calc(100% - 18px);
/* Opera */
height: -o-calc(100% - 18px);
/* Standard */
height: calc(100% - 18px);

이런 식으로 퍼센트에서 픽셀을 빼주면 된다.