liをflexboxで横並びした時
3つ全部ある場合
- ボックス1-------------ボックス1
- ボックス2----------------------------------------------ボックス2
- ボックス3
- ボックス4--------------------------------------------------------------------------------------------ボックス4
- ボックス5
- ボックス6
- ボックス7----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------ボックス7
- ボックス8
- ボックス9
背景色の高さを文字量に合わせる
- ボックス1-------------ボックス1
- ボックス2----------------------------------------------ボックス2
- ボックス3
- ボックス4--------------------------------------------------------------------------------------------ボックス4
- ボックス5
- ボックス6
- ボックス7----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------ボックス7
- ボックス8
- ボックス9
最終行のliが2つで終わる場合
- ボックス1-------------ボックス1
- ボックス2----------------------------------------------ボックス2
- ボックス3
- ボックス4--------------------------------------------------------------------------------------------ボックス4
- ボックス5
- ボックス6
- ボックス7----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------ボックス7
- ボックス8
最終行のliが2つで終わる場合(左寄せ)
- ボックス1-------------ボックス1
- ボックス2----------------------------------------------ボックス2
- ボックス3
- ボックス4--------------------------------------------------------------------------------------------ボックス4
- ボックス5
- ボックス6
- ボックス7----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------ボックス7
- ボックス8
4カラム表示で最終行のliが3つで終わる場合
- ボックス1-------------ボックス1
- ボックス2----------------------------------------------ボックス2
- ボックス3
- ボックス4--------------------------------------------------------------------------------------------ボックス4
- ボックス5
- ボックス6
- ボックス7----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------ボックス7
- ボックス8
- ボックス9
- ボックス10
- ボックス11
4カラム表示で最終行のliが3つで終わる場合(左寄せ)
- ボックス1-------------ボックス1
- ボックス2----------------------------------------------ボックス2
- ボックス3
- ボックス4--------------------------------------------------------------------------------------------ボックス4
- ボックス5
- ボックス6
- ボックス7----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------ボックス7
- ボックス8
- ボックス9
- ボックス10
- ボックス11
4カラム表示で最終行のliが2つで終わる場合
- ボックス1-------------ボックス1
- ボックス2----------------------------------------------ボックス2
- ボックス3
- ボックス4--------------------------------------------------------------------------------------------ボックス4
- ボックス5
- ボックス6
- ボックス7----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------ボックス7
- ボックス8
- ボックス9
- ボックス10
4カラム表示で最終行のliが2つで終わる場合(左寄せ)
- ボックス1-------------ボックス1
- ボックス2----------------------------------------------ボックス2
- ボックス3
- ボックス4--------------------------------------------------------------------------------------------ボックス4
- ボックス5
- ボックス6
- ボックス7----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------ボックス7
- ボックス8
- ボックス9
- ボックス10