레이아웃도 글꼴과 같이 브라우저의 화면 크기가 변하면 레이아웃의 크기도 비례하여 변경되어야 합니다.
레이아웃이 변경되면 각각의 위치하고 있는 요소들의 크기도 변경되고 해당 요소의 자식 요소들도 비례하여 크기가 변경 됩니다.
이렇게 브라우저의 화면 크기에 따라서 레이아웃이 변경되는 방식을 가변 레이아웃 방식 이라고 합니다.
이때 사용되는 단위가 퍼센트 (%) 입니다.
퍼센트는 백분율 값을 나타내는 단위이고 부모 요소와의 상대적 크기를 지정할 때 퍼센트를 사용 합니다.
퍼센트를 사용하는 프로퍼티로는 너비, 높이, 마진, 여백 등이 있습니다.
여기서 너비와 여백,마진은 부모요소의 너비를 기준으로 계산이되고 높이는 부모 요소의 높이를 기준으로 계산 됩니다.
calc 함수의 인수를 전달하면 결과값을 속성값으로 지정할 수 있습니다.