오류 주소 : http://www.homzzang.com/qna/21


F12키 누른 후, 하단 브라우저 모드에서 익스 하위 브라우저 (익스9 ~ 익스7) 선택해 증상 확인 가능합니다.
 
 
1. 메뉴 CSS가 먹히지 않습니다. 어떻게 해결해줘야 할까요? ㅜㅜ
(익스10, 크롬, 파이어폭스) 등에선 정상적으로 보이는데, 익스9 ~ 익스7 유저에겐 메뉴가 이상하게 보입니다.
스킨은 http://bit.ly/18va0TV  (관스틴 님 페이스북 메뉴 스킨)입니다. CSS는 맨 밑에 적어놓을게요.
 
오류 화면


정상화면


 
2. 우측 사이드바 고정시켜둔 게, 하단으로 내려가버립니다.  소스는 아래와 같습니다.
<div style="display:scroll;position:fixed;bottom:0px;right:1px;">
우측 사이드 메뉴
</div>
 
오류화면


정상화면








------------------------------------------------------

<style type="text/css">@import url(http://fonts.googleapis.com/css?family=Source+Sans+Pro:500);

/*
#########################################################
##        관스틴 페이스북 스타일 드롭 다운 메뉴 # 2            ##
##사이트 제작시, 메뉴 부분에서 고생하시는 분들은 위해...   ##
##앞으로도 더 좋은 스킨 개발하여, 배포하도록 노력하겠습니다..        ##
## date: 2013.04.03  Database: gnuboard4    ##
#########################################################
*/

/* Menu CSS */

#cssmenu, #cssmenu ul, #cssmenu ul li, #cssmenu ul li a{

padding: 0;
margin: 0;
line-height: 1;
font-family: 'Source Sans Pro', sans-serif;
font-weight: 500;
font-size: 12px;
color: white;
-webkit-transition: all ease .3s;
-o-transition: all ease .3s;
-moz-transition: all ease .3s;
-ms-transition: all ease .3s;
transition: all ease .3s;

}

#cssmenu:before, #cssmenu:after, #cssmenu > ul:before, #cssmenu > ul:after {

content: '';
display: table;

}


#cssmenu:after, #cssmenu > ul:after {

clear: both;

}

#cssmenu a{

text-shadow: 0 1px 1px rgba(0, 0, 0, .2);

}

#cssmenu ul{

background: #3b5998;
border-radius: 3px;
border: 1px solid #2b4479;
-webkit-box-shadow: 0 1px 2px rgba(2, 2, 2, .25), inset 0 1px 1px rgba(255, 255, 255, .15);
-o-box-shadow: 0 1px 2px rgba(2, 2, 2, .25), inset 0 1px 1px rgba(255, 255, 255, .15);
-moz-box-shadow: 0 1px 2px rgba(2, 2, 2, .25), inset 0 1px 1px rgba(255, 255, 255, .15);
-ms-box-shadow: 0 1px 2px rgba(2, 2, 2, .25), inset 0 1px 1px rgba(255, 255, 255, .15);
box-shadow: 0 1px 2px rgba(2, 2, 2, .25), inset 0 1px 1px rgba(255, 255, 255, .15);

}

#cssmenu ul > li{

float: left;
list-style: none;

}

#cssmenu ul > li > a{

display: block;
text-decoration: none;
padding: 6px 17px;
position: relative;

}

#cssmenu ul > li > a:hover{

background: #2f4b87;
-webkit-box-shadow: inset 0 0 1px #1f325d;
-o-box-shadow: inset 0 0 1px #1f325d;
-moz-box-shadow: inset 0 0 1px #1f325d;
-ms-box-shadow: inset 0 0 1px #1f325d;
box-shadow: inset 0 0 1px #1f325d;
-webkit-transition: all ease .3s;
-o-transition: all ease .3s;
-moz-transition: all ease .3s;
-ms-transition: all ease .3s;
transition: all ease .3s;

}

#cssmenu ul > li > a:hover:before{

content: '';
z-index: 2;
position: absolute;
border: 1px solid white;
border-top: 0;
border-bottom: 0;
border-right: 0;
width: 100%;
height: 100%;
top: 0;
left: -1px;
opacity: .2;

}

#cssmenu ul > li > a:hover:after{

content: '';
z-index: 2;
position: absolute;
border: 1px solid white;
border-top: 0;
border-bottom: 0;
border-left: 0;
width: 100%;
height: 100%;
top: 0;
right: -1px;
opacity: .2;

}

#cssmenu > ul > li > ul{

opacity: 0;
visibility: hidden;
position: absolute;

}

#cssmenu > ul > li:hover > ul{

opacity: 1;
visibility: visible;
position: absolute;
border-radius: 0 0 3px 3px;
-webkit-box-shadow: none;
-o-box-shadow: none;
-moz-box-shadow:none;
-ms-box-shadow: none;
box-shadow: none;

}

#cssmenu > ul > li > ul{

width: 150px;
position: absolute;

}

#cssmenu > ul > li > ul > li{

float: none;
position: relative;

}

#cssmenu > ul > li > ul > li > ul{

opacity: 0;
visibility: hidden;
position: absolute;

}

#cssmenu > ul > li > ul > li:hover > ul{

opacity: 1;
visibility: visible;
position: absolute;

}

#cssmenu > ul > li > ul > li > ul{

left: 202px;
top: 1px;
width: 200px;

}

#cssmenu > ul > li > ul > li > ul > li{

float: left;

}</style>

<div id='cssmenu'>
<ul>
  <li><a href='#>링크1</a></li>
  <li><a href='#>링크2</a></li>
  <li><a href='#>링크3</a></li>
  <li><a href='#>링크4</a></li>
  <li><a href='#>링크5</a></li>
  <li><a href='#>링크6</a></li>
<ul>
</div>