2017-01-23 71 views
-1

我正在使用flexbox構建表格,並且遇到了對齊問題。我希望能夠將我的內容與右側對齊,但我的標題居中。根據父標題將內容向右對齊

____________ 
| Test | 
|----------| 
|  $1 | 
|----------| 
| $312 | 
|----------| 

這裏有一個例子結構,我有JSfiddle,任何想法我怎麼能做到這一點使用Flexbox的?

回答

0

https://jsfiddle.net/04Lzxqun/2/ 刪除 display:flex; justify-content:flex-end; 從 .Parent DIV

.table{ 
    display: flex; 
    flex-direction: row; 
} 
.parent{ 
    flex-direction: column; 
    border: 1px solid black; 
    flex-basis: 1 0 50px; 
    width: 100%; 
} 

.parent div { 
    border: 1px solid black; 
} 
.parent span{ 
    text-align: left !important; 
} 
.parent .header{ 
    text-align: center !important; 
} 

.header { 
    background-color: blue; 
} 

.empty{ 
    visibility: hidden; 
} 
+0

謝謝,但它不是我問 – CanIHazCookieNow