2012-07-06 2 views
0

IE에서 배경 화면의 배경이 확장되지 않는 문제가 있습니다. 이것은 파이어 폭스에서는 잘 작동하지만 IE에서는 작동하지 않습니다. 당신이 아래 이미지에서 볼 수 있듯이. Broken Background사이드 바 배경이 아래쪽으로 흐림

Working Background

CSS : 나는 주요 사업부 주위에 맞게 사업부의 높이를 조정하기 위해 자바 스크립트를 사용하여이 자신을 해결 한

#SecondaryContent 
{ 
background: url(../images/background_slice.png) repeat-y 0% 0%; 
width: 18%; 
overflow: hidden; 
float: left; 
} 

#Container 
{ 
overflow:hidden; 
min-height:100%; 
height:auto!IMPORTANT; 
height:100%; /* Old browsers */ 

/* IE9 SVG, needs conditional override of 'filter' to 'none' Doesn't seem to work! 
background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIxMDAlIiB5Mj0iMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iI2VkZmRmZiIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjE4JSIgc3RvcC1jb2xvcj0iI2IzZTllZiIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjE4JSIgc3RvcC1jb2xvcj0iI2ZmZmZmZiIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiNmZmZmZmYiIHN0b3Atb3BhY2l0eT0iMSIvPgogIDwvbGluZWFyR3JhZGllbnQ+CiAgPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+); */ 
background: -moz-linear-gradient(left, #edfdff 0%, #b3e9ef 18%, #ffffff 18%, #ffffff 100%); /* FF3.6+ */ 
background: -webkit-gradient(linear, left top, right top, color-stop(0%,#edfdff), color-stop(18%,#b3e9ef), color-stop(18%,#ffffff), color-stop(100%,#ffffff)); /* Chrome,Safari4+ */ 
background: -webkit-linear-gradient(left, #edfdff 0%,#b3e9ef 18%,#ffffff 18%,#ffffff 100%); /* Chrome10+,Safari5.1+ */ 
background: -o-linear-gradient(left, #edfdff 0%,#b3e9ef 18%,#ffffff 18%,#ffffff 100%); /* Opera 11.10+ */ 
background: -ms-linear-gradient(left, #edfdff 0%,#b3e9ef 18%,#ffffff 18%,#ffffff 100%); /* IE10+ */ 
background: linear-gradient(left, #edfdff 0%,#b3e9ef 18%,#ffffff 18%,#ffffff 100%);  /* W3C */ 
/*filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#edfdff', endColorstr='#ffffff',GradientType=1);*/ /* IE6-8 */ 

} 
+0

HTML도 제공 할 수 있습니까? –

답변

0

.

<script type="text/javascript"> 
    var theHeight = $("#PrimaryContent").height() + 100; 
    $('#SecondaryContent').height(theHeight); 
</script> 
+0

JS는 추가 오버 헤드이므로 JS를 피하십시오. –

+1

다른 여러 가지를 시도했지만 이것이 작동하는 유일한 방법 인 것처럼 보였습니다. (JS를 사용하고자하는만큼 작았습니다! –