如何解決四溢的文字

Question

有人可以幫我解決我的筆的佈局嗎？ http://codepen.io/Sidney-Dev/pen/ALPgbG

當我開始調整頁面大小時，列表的內容開始溢出，我無法弄清楚它可能是什麼。

我給了我有表的部分的填充，以便恰當地查看內容溢出的方式。

div.tables{ 
    padding: 0 20px; 
} 

在此先感謝。

Answer 1

您在混合display: flex與特定的width屬性。

如果你正在使用你的表容器display: flex，堅持flex: 1上的表格，這樣反而：

table{ 
    width: 50%; 
} 

圍棋有：

table{ 
    flex: 1; 
} 

Answer 2

您需要設置的內容理由父容器，以便元素知道如何彎曲。您還需要將表格設置爲以靈活的方式顯示。

div.tables{ 
    padding: 0 20px; 
    justify-content:center; 
} 
table { 
    display:inline-flex 
}