让Safari识别<main> HTML 5

Question

似乎一些相当新版本的Safari不支持<main>HTML5元素.(我已经在Snow Leopard上测试了Safari 5.1.9,到目前为止在IOS 4上运行了移动Safari).有没有办法让Safari识别<main>元素(如shiv)？

我把下面的一些示例代码放在一起.在受影响的Safari版本中查看时,绿<main>框不会出现,如果我要添加更多文本,它将会流出该<main>元素,就好像它不在那里一样.

HTML:

<body>
    <main>
        <nav id="bar"></nav>
        <p>Lorem Ipsum</p>
    </main>
</body>

CSS:

main{
width:800px;
height:800px;
background-color:#0C0;
}

#bar{
width:300px;
height:400px;
float:left;
background-color:#09F;
}

Answer 1

大多数浏览器display:inline默认显示未知元素,因此在某个地方弹出这个CSS应该这样做:

main {
    display: block;
}

例如

main {
    display: block;
    width: 800px;
    height: 800px;
    background-color: #0C0;
}

(我在Mountain Lion上的Safari 6.0.5中测试过.)

Sitepoint对该<main>元素进行了很好的描述:http://www.sitepoint.com/html5-main-element/

还有一个很好的Stack Overflow答案,它以一般方式描述了如何在旧版浏览器中使用新的HTML5元素(对于"工作"的某些定义):https://stackoverflow.com/a/13949253/20578