display:flex funktioniert nicht in Chrome

Ich bin mit dem folgenden code, um zwei Boxen nebeneinander von gleicher Höhe:

<style>
.row {display:flex;}
.col {flex:1;}  
</style>

<div class="row">
  <div class="col content">some content</div>
  <div class="col content raw">some other content</div>
</div>

Dies funktioniert perfekt in Firefox, aber ich arbeite gerade an der mobile version meiner Website und Hinzugefügt box-sizing:border-box; zu meinem code. Dieses Durcheinander mit der flex aus irgendeinem Grund, so landete ich Einstellung box-sizing zu content-box auf die meisten Elemente wieder und dieses behoben. Jedoch, ich erkannte, dass der code funktioniert nicht in Chrome, egal ob desktop oder Mobil, ob meine box-sizing Linien da sind oder nicht, und ich kann nicht herausfinden, was nicht funktioniert. Die Tatsache, dass ich arbeite auf eine mobile Website, aber nichts zeigt sich mit Chrome wirklich stört mich.

Für die live-problem, die Seite ohne die box-sizing ist hier und die (angeblich) mobile-friendly ist hier.
Alles funktioniert auf Firefox in beiden, und die Handy-Vorschau auf der Firefox zeigt es perfekt zu. Kann mir jemand helfen, herauszufinden, was ist falsch?

CSS Flexbox, AFAIC, im Grunde funktioniert nicht in webkit.

InformationsquelleAutor Kach | 2015-05-29

  1. 12

    Ihre .Zeile:

    .row {
    display: inline-flex;
    width: 100%;
}

    Möglicherweise möchten Sie auch zu diesem Bericht Fehler zum team hinter Chrome.

    Ich danke Euch so sehr, dass es behoben, und noch immer funktioniert unter Firefox auch! Werde ich tun. Arbeiten auf mehreren Browsern ist die Hölle.
    Was ist, wenn diese nicht funktioniert?
    Dies ist eine der Fragen, die noch nicht behoben wurden zu diesem Zeitpunkt in Chrom: flexbugs

    InformationsquelleAutor kukis

  2. 1

    Verwenden
    row{
    display: flex;
    flex-direction: row;
    }

    InformationsquelleAutor Srikanth Vagga

Schreibe einen Kommentar