Höhe: -webkit-calc(100% - 155px); funktioniert nicht im Safari
kann jemand sehen, warum dies nicht funktioniert in Safari? Auf dieser Seite http://www.transurban.co.nz/newHomePage das div mit dem regler hat es die Höhe berechnet height: calc(100% - 155px); funktioniert Es perfekt für alle Browser außer Safari (Safari-spezifische = Höhe: -webkit-calc(100% - 155px); )
Jede Hilfe/Vorschläge sehr dankbar.
CSS
html, body, #wrapper { height: 100%; }
#headerHome {height:146px;}
#center {
height: 100%;
width:100%;
overflow: hidden;
height: -moz-calc(100% - 155px);
height: -webkit-calc(100% - 155px);
height: calc(100% - 155px);
}
.sliderBox{
width:100%;
height:100%;
}
HTML
<div id="wrapper">
<div id="headerHome">
HEADER STUFF
</div>
<div class="redBorder"></div>
<div id="center">
<div class="sliderBox">
SLIDER STUFF HERE
</div>
<div class="centralWrap">
MAIN CONTENT HERE
</div>
</div>
</div>
- Welche version von Safari, OS? caniuse.com/calc
- Safari 5.1.7 Windows 7
- Beachten Sie, dass die safari-Implementierung ist fehlerhaft: developer.mozilla.org/en-US/docs/Web/CSS/calc
- Danke. Kann jemand empfehlen, einen anderen Weg, um diese Höhe? Ich freue mich auf die CSS 3 Flexible Box-Model-Ansatz als eine mögliche Lösung zu hacks.mozilla.org/2010/04/the-css-3-flexible-box-model Schade, dass der calc(100% - nicht tun es für mich, wie es ist schön und einfach.
Du musst angemeldet sein, um einen Kommentar abzugeben.
Den
-webkit-calc
feature von Safari funktioniert (buggy) für version 6 und höher. Es wird nie funktionieren auf Windows (Safari für Windows ist veraltet und sollte nicht mehr verwendet werden).https://developer.mozilla.org/en-US/docs/Web/CSS/calc