Câu hỏi được gắn thẻ «flexbox»

Tôi muốn sử dụng flexbox có một số mục có cùng chiều rộng. Tôi đã nhận thấy rằng flexbox phân phối không gian xung quanh đồng đều, thay vì chính không gian đó. Ví dụ: .header { display: flex; } .item { flex-grow: 1; text-align: center; border: 1px solid black; …

186 css  flexbox 

Hãy xem xét đoạn trích sau: .parent { display: flex; flex-direction: column; width: 400px; border: 1px solid red; align-items: center; } .child { border: 1px solid blue; } <div class="parent"> <div class="child"> Lorem Ipsum is simply dummy text of the printing and typesetting industry </div> <div class="child"> Lorem Ipsum is …

176 css  internet-explorer  flexbox  internet-explorer-11 

Tôi đang làm việc trên một bố trí flexbox lồng nhau nên hoạt động như sau: Cấp độ ngoài cùng ( ul#main) là một danh sách ngang phải mở rộng sang bên phải khi thêm nhiều mục vào nó. Nếu nó phát triển quá lớn, cần có một thanh cuộn …

166 html  css  flexbox 

Đã đóng cửa . Câu hỏi này dựa trên ý kiến . Nó hiện không chấp nhận câu trả lời. Bạn muốn cải thiện câu hỏi này? Cập nhật câu hỏi để có thể trả lời bằng sự kiện và trích dẫn bằng cách chỉnh sửa bài đăng này . …

161 html  css  twitter-bootstrap  flexbox 

Hãy tưởng tượng bố cục sau đây, trong đó các dấu chấm đại diện cho không gian giữa các hộp: [Left box]......[Center box]......[Right box] Khi tôi bỏ hộp bên phải, tôi thích hộp trung tâm vẫn ở giữa, như vậy: [Left box]......[Center box]................. Điều tương tự cũng xảy ra nếu …

161 html  css  flexbox  centering 

Flexbox có hành vi này trong đó nó kéo dài hình ảnh đến chiều cao tự nhiên của chúng. Nói cách khác, nếu tôi có một hộp chứa flexbox với hình ảnh con và tôi thay đổi kích thước chiều rộng của hình ảnh đó, chiều cao hoàn toàn không …

156 html  css  flexbox 

Tôi có một container <div>với display: flex. Nó có một đứa con<a> . Làm thế nào tôi có thể làm cho đứa trẻ xuất hiện "nội tuyến"? Cụ thể, làm thế nào tôi có thể làm cho chiều rộng của trẻ được xác định bởi nội dung của nó và …

154 html  css  flexbox 

CodePen: http://codepen.io/anon/pen/RPNpaP . Tôi muốn hộp màu đỏ chỉ rộng 25 em khi ở chế độ xem cạnh nhau - Tôi đang cố gắng đạt được điều này bằng cách đặt CSS bên trong truy vấn phương tiện này: @media all and (min-width: 811px) {...} đến: .flexbox .red { width: …

149 html  css  flexbox 

Tôi muốn có A Bvà Cliên kết ở giữa. Làm thế nào tôi có Dthể đi hoàn toàn sang phải? TRƯỚC: SAU: ul { padding: 0; margin: 0; display: flex; flex-direction: row; justify-content: center; align-items: center; } li { display: flex; margin: 1px; padding: 5px; background: #aaa; } li:last-child { …

146 html  css  flexbox 

Tôi có một flexbox trái-phải: .wrapper { display: flex; flex-direction: row; align-items: stretch; width: 100%; height: 70vh; min-height: 325px; max-height:570px; } <div class="wrapper"> <div class="left">Left</div> <div class="right">Right</div> </div> Chạy đoạn mãẨn kết quảMở rộng đoạn trích Vấn đề là đứa trẻ đúng không cư xử phản ứng nhanh. Để cụ …

141 css  flexbox 

Tôi cần phải thực hiện một bố cục xây dựng khá bình thường. Tuy nhiên, vì một số lý do tôi không muốn sử dụng JavaScript để làm điều đó. Thông số: Tất cả các yếu tố có cùng chiều rộng Các phần tử có chiều cao không thể tính …

134 html  css  flexbox  css-grid 

Như chúng ta đều biết, flexbất động sản là một cách viết tắt cho flex-grow, flex-shrinkvà các flex-basistài sản. Giá trị mặc định của nó là 0 1 auto, có nghĩa là flex-grow: 0; flex-shrink: 1; flex-basis: auto; nhưng tôi nhận thấy, ở nhiều nơi flex: 1được sử dụng. Nó …

129 css  flexbox 

Các mã sau đây có thể được tìm thấy trong ví dụ trực tiếp này Tôi đã có các yếu tố bản địa phản ứng sau: 'use strict'; var React = require('react-native'); var { AppRegistry, StyleSheet, Text, View, } = React; var SampleApp = React.createClass({ render: function() { return ( …

121 css  reactjs  react-native  flexbox 

Với CSS điển hình, tôi có thể thả nổi một trong hai cột sang trái và cột khác bên phải với một số khoảng trống ở giữa. Làm thế nào tôi sẽ làm điều đó với flexbox? http://jsfiddle.net/1sp9jd32/ #container { width: 500px; border: solid 1px #000; display: -webkit-flex; display: -ms-flexbox; …

121 html  css  flexbox 

Tôi đã tìm thấy chủ đề này - Làm cách nào để kéo giãn hình ảnh để lấp đầy <div> trong khi vẫn giữ nguyên tỷ lệ khung hình của hình ảnh? - đó không hoàn toàn là điều tôi muốn. Tôi có một div với kích thước nhất định …

120 image  css  positioning  flexbox