（♪♪♪♪♪♪♪）どうも！どうも！ようこそプログラミングコナーへ！
私はあなたの愛しい司会NISO desu!
始まる前に前回のあらすじに入ります！
Flexを使わないと、横並びはしません。
Flexを使うと横並びます。
さて、続きをしましょうか。
果たして、Flexとinline-blockにはどんな違いがあるでしょう？
早速ですが、inline-blockを見てみましょう（♪♪♪♪♪♪♪）
inline-blockを入れたらこうなります。。
あれ？横並びになってない。。？
先ず最初の違いは、inline-blockは親要素でないことです。
ですので、
abcとabc1にinline-block要素をつけるべきです
ちなみに前回flexの図はこちらになります↓↓↓↓
次の違いが分かるようになりましたか？
そう！赤の位置が違うんだ！
その原因はDeveloper Toolsで解明できます。
flex
inline-block
Flexの場合、outerabcは三つの枠に分けていますので、相殺がなくなります。（flex条約の元に、ついに平和が訪れた）
そして、inline-blockは分けてないので、その戦まだ続けています！（いざ！出陣！）
個人的には、flexのほうが枠がちゃんと分かれているので、使いやすいと思っていますが、場合によって、変わりますので、ぜひぜひ、皆さんも使ってみてください！
以上！今日はプログラミング記事でした！