上一篇博客提到fit-content可以自適應寬度，但是這個屬性只能在Chrome瀏覽器上使用，在Firefox上需要加上-moz-前綴。不能在IE瀏覽器上兼容，
通過研究發現，width:auto;可以代替這個屬性，但是需要在最外層的父元素上面加上屬性display:flex;
下圖是我的盒子結構，我想讓兩個子盒子的寬度自適應屏幕的大小，並且一直在頁面居中顯示，但這兩個盒子始終都是互相左對齊的：
下面是我的代碼：
.grandfather{
display: flex !important;
}
.father{
display: flex;
justify-content: flex-start;
flex-direction: column;
align-items: flex-start;
width: auto;
margin: 0 auto;
/*
下面這兩個屬性被我用width:auto;代替了
width: -moz-fit-content; /*firefox
width: fit-content; /*chrome
*/
}
.child1{
display: flex;
justify-content: flex-start;
flex-flow: row nowrap;
}
.child2{
display: flex;
justify-content: flex-start;
align-items: center;
flex-flow: row nowrap;
}