When viewing This Page in IE9, the element section#tcs-website-content
appears as 990px wide even though its CSS property is set to width: 100%
. This occurs despite all parent elements also having a width of 100%, resulting in a browser width of 1024px.
As someone unfamiliar with IE9, I am unsure of what specific issue to address in this situation.
Below is the CSS (LESS) for the relevant elements:
html, body {
margin: 0;
padding: 0;
max-height: 100%;
min-height: 100%;
height: 100%;
width: 100%;
min-width: 100%;
max-width: 100%;
position: relative;
background: none;
font-family: 'muliregular','oswaldregular',Arial;
}
#viewport {
display: none;
position: relative;
float: left;
width: 100%;
height: 100%;
overflow-y: hidden;
background: none;
}
#tcs-website-content {
position: absolute;
z-index: 100;
top: 120px;
bottom: 0;
left: 0;
width: 100%;
overflow: hidden;
overflow-y: auto;
#bundle .box-sizing();
& .inner-content {
width: 960px;
margin: 0 auto;
}
}