Tanımak için Safari elde etme <main> HTML 5

Bazı eski Safari sürümlerinin, <main> HTML5 öğesini desteklemediği anlaşılıyor. (Snow Leopard'da Safari 5.1.9'u ve şu ana kadar IOS 4'te çalışan mobil Safari'yi test ettim). Safari'yi <main> öğesinin (bir shiv gibi) tanıması için bir yol var mı?Tanımak için Safari elde etme <main> HTML 5

Aşağıda bazı örnek kodları bir araya getirdik. Safari'nin etkilenen bir sürümünde görüntülendiğinde, yeşil <main> kutusu görünmüyor, daha fazla metin ekleyeceksem <main> öğesinin dışına, sanki orada olmasa bile akıyordu.

HTML:

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

CSS: varsayılan olarak display:inline sanki

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

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

kaynak

2013-07-15 Elle

Öğeyi belgeye eklediniz ve bunun için varsayılan stil? 've' main {display: block;} ' – PeeHaa

@PeeHaa:' 'sadece IE8 ve daha önceki sürümler için gerekli olmalıdır. –

Çoğu tarayıcı öyle yapmalıyım yerde bu CSS haşhaş, bilinmeyen öğeleri görüntülemek:

main { 
    display: block; 
}

E.g.

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

http://jsfiddle.net/PeF8u/ - yeşil alan görünmez
http://jsfiddle.net/PeF8u/1/ - görünür yeşil alan

(. Ben Mountain Lion Safari 6.0.5 test)

SitePoint iyi olması <main> öğesinin bir kopyası: http://www.sitepoint.com/html5-main-element/

Ayrıca, eski tarayıcılarda yeni HTML5 öğelerinin nasıl çalıştığını ("çalışma" nın bazı tanımı için) genel bir şekilde açıklayan harika bir Yığın Taşması yanıtı da vardır: https://stackoverflow.com/a/13949253/20578

kaynak

2013-07-15 18:53:18

Wow Paul, hızlı yanıt için teşekkürler! Bu sorunu düzeltir, ben bunu yapmadım inanamıyorum (bloklar olarak görüntülemek için diğer birçok HTML5 öğeleri anlatmak zorunda kaldı). Bu soruyu tamamen utançtan silebilirdim, ama başkalarına yardım edebileceğini hissediyorum, bu yüzden onu yalnız bırakacağım. Tekrar teşekkürler! – Elle

@ user2569147: Çok hoş geldiniz - 7 dakika aslında Overflow için oldukça yavaştır, özellikle bunun gibi slam-dunk sorular için (bu arada, çok sorulan sorular). Evet, unutmak kolay - Projelerim için her zaman [Eric Meyer'in CSS Sıfırlaması] (http://meyerweb.com/eric/tools/css/reset/) kullanıyorum, ancak şu anda "

" özelliğini içermiyor. Ben de unutmuştum. Bence başkalarına yardım edebilecek haklısın, kesinlikle oradan ayrılmaya değer. –

Normalleştirmeyi denediniz mi? – Chris

Tanımak için Safari elde etme <main> HTML 5

cevap

İlgili konular