Tag: flexbox

CSS3-Modul für flexible layouts mit einer breiten Palette von Optionen für die Anordnung der Elemente und eliminiert die Notwendigkeit für Schwimmer und Tabellen.

Kann flexbox-unterteilen Elemente gleichmäßig auf mehrere Zeilen?

Anzahl der Antworten 2 Antworten
Ich habe gespielt, um mit responsive flexbox, grids, die keine media queries. http://jsbin.com/qurumisu/1 (skalieren der Fenster, um zu sehen, wie es funktioniert) Passt es so viele flex-Elemente es können pro Zeile erstreckt und Ihre Breite gleichmäßig zu

Wie zu verwenden zIndex in reagieren-native

Anzahl der Antworten 4 Antworten
Habe ich möchte Folgendes erreichen: Die folgenden Bilder sind was kann ich jetzt tun, aber das ist NICHT das, was ich will. Beispiel-code habe ich jetzt: renderA() { return ( <View style={ position: 'absolute', zIndex: 0 }>

Inhalt mit 100% zwischen Kopf-und Fußzeile

Anzahl der Antworten 3 Antworten
Vermuten lässt habe ich das folgende layout (siehe Bild unten)... ich habe einen header (A) an der Spitze, Fußzeile (C), immer an der Unterseite und container (B), die in der Mitte und füllen den Raum zwischen der

Feste Breite Spalte mit einem container-fluid

Anzahl der Antworten 2 Antworten
Ich versuche eine Lösung zu finden, um einen seitlichen Spalte auf der linken Seite mit fester Breite, und klicken Sie dann auf der rechten Seite eine normale Bootstrap -container-fluid. Selbst wenn die sidebar befindet sich nicht in

align-self Eigenschaft in flexbox funktioniert nicht?

Anzahl der Antworten 2 Antworten
Ich versuche zu verstehen, flex box: Ich will die "erste" block gestreckt entsprechend die volle Breite des browser, und der "zweite" block fester Größe und ausgerichtet auf die Links. So habe ich align-items: flex-end im übergeordneten(<html>) und

Winkel-Material behoben-Symbolleiste UND sticky footer

Anzahl der Antworten 2 Antworten
Habe ich schon schlägt meinen Kopf gegen dieses Problem seit einiger Zeit und irgendwie kam mit einer Lösung. Ich möchte eine Feste toolbar (Navigationsleiste) als auch als sticky (floating) Fußzeile. Die Fußzeile sollte der Schwimmer an der

CSS-Flex-grid - Gleiche Breite für das Letzte Element

Anzahl der Antworten 3 Antworten
Hey ich bin versucht zu erstellen, eine ansprechende box-layout für eine Galerie, die wie folgt aussieht http://webdesignerwall.com/demo/responsive-column-grid/ Das problem mit dem Beispiel ist, dass die Spaltenbreiten sind hardcoded und media queries notwendig sind. Ich habe zu viele

Flexbox füllen den verfügbaren Raum vertikal

Anzahl der Antworten 0 Antworten
Nun in eine flexbox-Zeile, die ich schreiben kann <div layout="row"> <div>some content</div> <div flex></div> <!-- fills/grows available space --> <div>another content</div> </div> Würde ich mag, um das gleiche zu erreichen, sondern vertikal, wie auf diesem Bild Derzeit

Cross-Browser-Unterstützung für CSS Flexbox

Anzahl der Antworten 5 Antworten
Habe ich mit dem code unten erwähnt, es funktioniert auf meinem Chrome, aber nicht auf meine IE9 und Safari. Googelte ich nach der Lösung, obwohl ich verschiedene vendor-Präfixe, diese Ergebnisse verwirren mich. <div style="display: flex; flex-direction: row;">

Safari flexbox nicht enthalten, seine Elemente richtig

Anzahl der Antworten 2 Antworten
Habe ich eine einfache flexbox-basierte Seite, die macht richtig in Google Chrome (Version 44.0.2403.157), aber nicht in Safari (ab Version 8.0.2 (10600.2.5)). Ich habe alle relevanten Präfixe (glaube ich) und haben viel Zeit, sich auf den Inspektor,

Wie vertikal ausrichten und Strecken Sie Inhalte mit CSS flexbox

Anzahl der Antworten 3 Antworten
Mit CSS flexbox, wie kann ich gleichzeitig vertikal zentrieren den Inhalt aller divs in einer Zeile unter Beibehaltung der gleichen Höhe auf allen von Ihnen, ohne Verwendung der css - height Attribut? Details — http://jsbin.com/efaCEVa/1/edit mögliche Duplikate

Flexbox IE10 Breite Fragen

Anzahl der Antworten 1 Antworten
Das problem ist, dass im IE10 wird die Breite der Spalten innerhalb der Zeile wird falsch berechnet, es erscheint zu sein indem auf die Breite der Spalte Rand (insgesamt 80px), aber in Firefox und Chrome, es berechnet

Wie zu verwenden css3 flexbox, multi-column layout ohne ausbau des vertikal?

Anzahl der Antworten 2 Antworten
Spiele ich mit dem css3 - flexbox-in Chrom (sorgen Sie sich nicht um cross-browser). Ich habe eine harte Zeit zu überzeugen, dass es lag, mein Inhalt, die Art, wie ich möchte. Hier ist eine Skizze von meinem

Flexbox funktioniert nicht im Safari

Anzahl der Antworten 1 Antworten
Dem layout bin ich erstellen funktioniert nicht im Safari, obwohl es funktioniert perfekt in Chrome. Ich habe das Gefühl, es hat etwas zu tun mit der .wrapper oder die .frame aber ich habe versucht Einstellung der Flex-Shrink-Wert

CSS3-Flexbox-Abstand zwischen Elementen

Anzahl der Antworten 1 Antworten
Etwas neues zu Flexbox (obwohl erfahren in CSS), es scheint mir, dass eine Sache, die bequem "geschönt", indem Sie die meisten tutorials die ich gelesen habe, ist der Abstand zwischen den flex-items. Beispielsweise, einer der am meisten

Flexbox in IE10

Anzahl der Antworten 1 Antworten
Ich versuche, flex-box funktioniert in IE10, aber es funktioniert nicht. Safari, Chrome und Firefox funktionieren, aber IE10 nicht will arbeiten. Weiß jemand die Antwort? codepen: http://codepen.io/anon/pen/vcEGH/ display: -moz-box; /* OLD - Firefox 19- (doesn't work very well)

warum ist nicht mein flexbox-flex-stretch-Eigenschaft arbeiten?

Anzahl der Antworten 1 Antworten
Ich versuche, die drei flex-Kinder-Boxen zu Strecken mit flexbox, den container zu füllen, so dass alle drei Boxen sind die gleiche Größe. Aber ich will nicht, dass die ersten beiden in Kartons zu dehnen - ich will

Flex-element ignorieren child-element

Anzahl der Antworten 4 Antworten
Ist es möglich, eine flex-element ignorieren, ein Kind-element, so ist es die grösse hat keinen Einfluss auf die anderen Elemente? Zum Beispiel habe ich einen wrapper mit display: flex. Es hat einen header, Inhalt und Fußzeile. <div

Wie verwenden von flex-grow in Bootstrap v4?

Anzahl der Antworten 1 Antworten
In der doc und die Probleme der Bootstrap v4 (hier) Ich kann nicht sehen, jeder plan auf die Unterstützung von "flex-grow", etwas mit einer syntax wie in diesem Beispiel: <div class="d-flex"> <div class="flex-grow"> I use all the

wie man verschachtelte flexboxes Arbeit

Anzahl der Antworten 3 Antworten
Habe ich ein kleines Beispiel für eine geschachtelte flexbox-setup: http://jsfiddle.net/ThomasSpiessens/MUrPj/12/ <div class="box fullSize"> <div class="boxHeader">HEADER</div> <div class="boxContent"> <div class="box fullSize"> <div class="boxHeader moregreen">INNER HEADER</div> <div class="boxContent red">CONTENT CONTENT CONTENT</div> <div class="boxFooter moreblue">INNER FOOTER</div> </div> </div> <div class="boxFooter">FOOTER</div>