ときどき中央揃えにはマイナス margin を使う
このように left
等の値でオブジェクトサイズ分微妙に中央からそらすやり方では、デバイスサイズが変わると表示位置がずれる。
.hoge:after { content: "⌃"; position: absolute; bottom: -2px; left: 49.2%; /* <- */ width: 30px; height: 15px; ... }
マイナス margin
をオブジェクトサイズの半分とって中央揃えさせるほうが良い。
デバイスのサイズに左右されずに中央が取れる。
.hoge:after { content: "⌃"; position: absolute; bottom: -2px; left: 50%; /* <- */ margin-left: -15px; /* <- */ width: 30px; height: 15px; ... }