IE8的div宽度float：正确的问题为响应网站

Question

我有一个div，＃cont3，包含另一个div，div.banner。 ＃cont3有一个背景图片。 div.banner只是一个白色的浮动div，里面有文字。它工作在任何地方，但IE8 - 当然。这就是它的意思是这样的：

这是它在IE8：

股利不浮动，是瘦骨嶙峋。下面是相关的HTML（div.container直接body标签内）：

<div class="container" id="cont3"> 
    <div class="block">  
     <div class="banner"> 
      <h1>Contact us</h1> 
      <p>Blah blah</p> 
     </div> 
    </div> 
</div> 

而CSS：

html { 
    box-sizing: border-box; 
    font-family: "Noto serif", serif; 
    color: dimgray; 
    font-weight: 100; 
    height: 100%; 
width: 100%; 
} 



*, *:before, *:after { 
    box-sizing: border-box; 
} 


body { 
    margin: 0; 
    padding: 0; 
    height: 100%; 
    font-size: 100%; 
width: 100%; 
} 

h1 { 
    font-size: 55px; 
    font-size: 3.2em; 
    font-size: 350%; 
    font-size: 4.5vw; 
    color: #C9494D; 
    font-family: "Noto serif", serif; 
    font-weight: 100; 
    text-align: left; 
    margin-left: 3%; 

} 

p { 
    display: block; 
    clear: both; 
    float: left; 
    text-align: left; 
    margin-bottom: 10px; 

} 


div.container { 
    display: block; 
    float: left; 
    width: 100%; 
    height: 100%; 

} 

div#cont3 { 
    display: block; 
    float: left; 
    width: 100%; 
    height: 100%; 
    background-image: url("images/london_1920.jpg"); 
    background-size: cover; 
    -ms-behavior: url('backgroundsize.htc'); 
    background-repeat: no-repeat; 
    position: relative; 
} 


div#cont3 div.banner { 
    display: block; 
    float: right; 
    font-size: 12px; 
    font-size: 70%; 
    font-size: 1.1vmax; 
    width: 90%; 
    max-width: 60%; 
/* height: 80%; */ 
    margin-right: 5%; 
    margin-top: 5%; 
    background-color: white; 
    background-color: rgba(255,255,255,0.9); 
    padding-bottom: 20px; 

} 

我一直在摆弄随高度，并添加尺寸到父容器，如在这个论坛上的其他问题。我也一直试图解决超大标题，但没有喜悦。 IE8固执地使他们太大了！

任何人都可以发现我做错了什么吗？ 感谢

Answer 1

在您添加此，看看它是否工作

<!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries --> 
    <!-- WARNING: Respond.js doesn't work if you view the page via file:// --> 
    <!--[if lt IE 9]> 
     <script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script> 
     <script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script> 
    <![endif]-->