레이아웃 설정시 css를 이용한 float 속성으로 왼쪽 사이드바, 오른쪽은 나머지를 폭을 지정하고 싶습니다.

0 투표
895 조회

HTML

<div id="left-sidebar"></div>
<div id="content"></div>

CSS

#left-sidebar {
    float: left; width: 200px;
}
#content {
    float: left; width: auto;
}

위 CSS에서 #content 영역의 폭을 자동으로 나머지로 하고 싶은데 되질 않습니다.

요청 : 2015년 4월 10일 마크업 언어 분류 내 작성자 query (2,020 포인트)

1 개의 답변

0 투표
#left-sidebar {
    width: 200px; float: left;
}
#content {
    overflow: hidden;
}

참고로 3단으로 구성시는 다음과 같이 하면 브라우저의 폭에 대응합니다.

#left{
    float:left;
    width:200px;
    height:400px;
    border:1px solid #000;
}
#center{
    overflow:hidden;
    height:400px;
    border:1px solid red;
}
#right{
    float:right;
    width:100px;
    height:400px;
    border:1px solid blue;
}

 

답변: 2015년 4월 10일 작성자 queryeditor (5,040 포인트)