수다닷컴

안녕하세요. 제목과 같이 질문 드립니다.
주황색 박스안에 있는 저 부분이 변경 될 위치입니다.브라우저 사이즈를 줄였다 늘였다 할때 레이아웃이 브라우져에 따라 이동되는걸 반응형 웹이라고 알고 있습니다.그런데 저는 width값만 변경되게 하려고 해요.

위 이미지와같이 저 부분만 줄어들게 하려고 합니다.검색하면서 해 보았으나 사실 저 부분은 아무리 읽어보고 적용해도 이해도 안되고 잘 모르겠더라구요.ㅠㅠ혹시 css만으로도 박스 사이즈가 줄었다 늘렸다 하는게 가능할까요??

■ 발생 문제에 대한 자세한 기술:
html==================================================
body
div id=wrapper div id=header
div class=headerLogo
a href=#img src=http://image.changinghero.co.kr/design/images/main/logo.png //a
/div
div class=social
ul
lia href=#img src=/lihttp://image.changinghero.co.kr/design/images/main/rssIcon.gif/a/li/a
lia href=#img src=/lihttp://image.changinghero.co.kr/design/images/main/facebookIcon.gif/a/li/a
lia href=#img src=/lihttp://image.changinghero.co.kr/design/images/main/twitterIcon.gif/a/li/a
/ul
/div
div class=loginA
ul
li class=idinput style=background: url(http://image.changinghero.co.kr/design/images/main/id.gif) onfocus=this.style.background=';this tabIndex=1 name=id/li
li class=pwinput style=background: url(http://image.changinghero.co.kr/design/images/main/pw.gif) onfocus=this.style.background=';this tabIndex=2 type=password name=password/li
li class=loginBtna onfocus=this.blur() href=#img src=http://image.changinghero.co.kr/design/images/main/loginBt.gif //a/li
li class=fine_ida onfocus=this.blur() href=#아이디/비밀번호 찾기/a/li
li class=joina onfocus=this.blur() href=#strong회원가입/strong/a/li
/ul
/div
/div

div class=centercolumn
ul class=contentTab
li class=tabevea href=#이벤트/a/li
li class=tabranka href=#랭크/a/li
li class=tabcomua href=#커뮤니티/a/li
li class=tabcarda href=#카드정보/a/li
li class=tabcasha href=#캐시/a/li
/ul
/div

div class=rightcolumn
img src=http://image.changinghero.co.kr/design/images/main/rightImg.jpg
/div

div class=footer
ul class=botMenu
li class=homea href=#home/a/li
li class=comua href=#comunity/a/li
li class=ranka href=#ranking/a/li
li class=gameinfoa href=#gameinfo/a/li
li class=mypagea href=#mypage/a/li
li class=casha href=#cash/a/li
li cllt;li class=evea href=#event/a/li
/ul
/div

/div

/body

css======================================================================
.rightcolumn {background:none repeat scroll 0 0 #999966; margin: 0 auto; /* IE Hack */ min-width: 400px; max-width: 484px; width: 484px; float: left; height: 802px;}
.rightcolumn img{max-width: 100%;}
* html .centercolumn {height:300px} /* IE Min-Height Hack */

css에서 이런식으로 해보았는데 도통 되지가 않네요.ㅠㅠ뭐가 문제인지 모르겠어요.ㅠㅠ 프로그래머분도 잘 모르겠다고 해서 질문 드립니다.ㅠㅠ

신청하기