レスポンシブ対応でテーブルを縦並びに変更していたら実機確認で描画が崩れて結構ビビった
レスポンシブ対応で、テーブルのthとtrにdisplay: blockをスマホだけかけて、縦並びにするというのをやりました。
Chromeのデベロッパーツール で問題なく縦並びになっていたのですが、本番にアップされて実機確認したら、縦並びになってない!
ということでちょっとビビって調査して、解決したので覚書。
結論は、DOCTYPE宣言がなかった、ということでした!
そんだけかい!!!
CSS - tableのth、tdをスマホ時に縦並びにしたい|teratail
css - Display:Block not working in Chrome or Safari - Stack Overflow
<!DOCTYPE html>って何なの?? - Qiita
DOCTYPE宣言にそんな意味があったとは・・・
大変勉強になりました!