How to get min-height funktioniert im Safari, Chrome auf MAC

Habe ich eine Seite mit dem folgenden CSS, macht es gut auf IE und FF, aber auf dem Mac in Safari und Chrome, die min-height scheint nicht zu funktionieren, und der gesamte Inhalt fällt auf der jeweils anderen, wenn der browser die Seite ist kurz, anstatt sich erweitert und bietet scrollbars:

<style type="text/css">
    html, body {
   height: 100%;
        width: 100%;
    }
    body {
   height: 100%;
        width: 100%;
        background: #000000;
        font: 86% Arial, "Helvetica Neue", sans-serif;
        margin: 0;   
        padding: 0px;
        color: #CCCCCC;
    }
    #website_wrapper {
        min-height: 850px;
   min-width: 1080px;
        height: 100%;
        width: 100%;
    }
    #website {
        height: 100%;
        width: 100%;
        background-color: #000000;
        vertical-align: bottom;
    }

Irgendwelche Ideen, warum Safari (WebKit-denke ich-nicht tun, was gesagt wird, zu tun?
Vielen Dank im Voraus...

Sie haben 100% nach Ihren min-height. aber min-height ist bugged out für mich in webkit zu. ich dachte, ich Stelle es aus.

InformationsquelleAutor dsire | 2010-08-22

  1. 3

    Für einige Grund ich 'm, die Begegnung so ähnliches Problem, wo meine navbar auf "Safari", ist eine unterschiedliche Höhe in anderen Browsern.

    Um es zu beheben habe ich verwendet min-height: initial

    Ich auch verpackt diese in einem safari-spezifischen media query, mögliche Konflikte zu vermeiden:

    gibt es einen css hack für safari nur NICHT chrome?

    InformationsquelleAutor endymion1818

  2. 1

    Folgende Beispiel funktioniert bei mir unter Mac OS X 10.6.4 mit Safari 5.0.1 (nicht sicher, welche version von Webkit):

    <html>
    <head>
    <!--
        <style>
        .box1 {
            float: left;
            width: 100px;
            margin: 1em 20px 1em 0;
            background: yellow;
            border: 1px solid black;
            min-height: 100px;
        }
    -->
    </style>
    </head>
    <body>
        <div class="box1"></div>
        <div class="box1">less text</div>
        <div class="box1">more text more text more text more text more text more text</div>
    </body>
</html>

    Kann ich nicht sagen, aus deinem Beispiel, wie Sie die Umsetzung Ihrer Stile, wie Sie nur zeigen Sie Ihren Stil-Definitionen. Eine andere Sache, die ich bemerkt habe, ist, dass Sie bei der Definition der ID-Stile (#- notation) anstelle der class-Stile (dot-notation). Obwohl, das funktioniert auch, es ist empfohlen , definieren Sie Klasse Stile, wenn Sie wollen, so wenden Sie einen Stil auf mehrere Elemente.

    Wenn dieses Beispiel hilft Ihnen nicht, vielleicht können Sie fügen Sie einige HTML-Code, der zeigt, WIE Sie mit Ihrer Stile.

    Dies hat geholfen, danke! @meteorainer Nur sagen, dass dieses Problem ist auch verbuggt, sollten Sie wirklich einen Kommentar zu der Frage statt einer Antwort: FAQ - Antworten "danke!" oder "ich auch!" - Antworten

    InformationsquelleAutor Ryan H.

  3. 0

    min-height ist, soll unterstützt werden in Safari jetzt aber möchten Sie vielleicht, um zu versuchen, die Unterstrich hack:

    min-height: 850px;
    height: auto;
    _height: 850px;

    Dank HZC, aber das bedeutet nicht scheinen, es zu tun...

    InformationsquelleAutor Ryan H.

Schreibe einen Kommentar