【Web制作】position:topの挙動変わった?

投稿日:
2019.1.28
カテゴリー:
Web制作 , IT・科学
59:名無しさん 2019/01/18(金) 18:37:49.62 ID:???

cssで、hightの挙動って去年変更あった?
上に移動していて、heightの数値を増やして元の場所に戻せたんだけど、どういう変更なんでしょう?

60:名無しさん 2019/01/18(金) 18:41:31.05 ID:???

何言ってるのか誰か説明しろ

61:名無しさん 2019/01/18(金) 19:08:16.57 ID:???

>>60
すまん、俺もよくわかってないんだが、
heightじゃなくtopだったわ。

display:blockにしているsectionが5年ぐらい前は正常な位置だったんだけど、

section.option{width:300px;position:absolute;right:328px; top: 644px}

今見たら、昔より50pxぐらい上にあって
topの値を増やして下に移動させて調整したんだけど、position:absoluteとtopの関係って何か変わったのかなと。

66:名無しさん 2019/01/18(金) 20:20:21.75 ID:???

>>61
変わったのはブラウザの解釈。恐らく今が正常な状態
以前は変なhtmlかcssを無理やり解釈してずれた状態になっていたんだと思う。
確認したブラウザはIE8辺りじゃないか

67:名無しさん 2019/01/18(金) 20:37:40.35 ID:???

>>66
そうだと思います。IEもFirefoxもずれていました。
2013年ぐらいに作成したページで、当時html5がまだ完全に決まっていなかった時代、
cssハックがなんとか言っていた前任がIE8で確認していましたのですが、やはり解釈がいつかわかりませんが変わったのですね。

62:名無しさん 2019/01/18(金) 19:15:47.82 ID:???

関係が変わったらお前のクソサイト以外にも影響でか過ぎるだろ
自分の無能さではなくhtmlの仕様のせいにしようとしている思考をまず改めたほうがいい

63:名無しさん 2019/01/18(金) 19:19:44.22 ID:???

>>62
うーん、そうなのか。
元から崩れていたわけではないけど、気になるな・・・

64:名無しさん 2019/01/18(金) 19:26:19.97 ID:???

>>63
初心者板だからアドバイスするとしたら、ずれた要素を確認するのではなく、
その要素の親や要素の前にある要素のpositionがrelativeを指定しているか確認するとよい

65:名無しさん 2019/01/18(金) 19:49:56.23 ID:???

>>64
ありがとう、確かにかなりのdivが入れ子になっているのもあって、
positionをまだ理解できていないので親要素を確認してみます。

68:名無しさん 2019/01/18(金) 20:54:38.58 ID:???

cssハックはもう止めたほうが良い
今あれやると、どのブラウザでどういう挙動するかサッパリ分からん

引用元: http://mevius.5ch.net/test/read.cgi/hp/1546055063/

CSS全体に言えるけど、基本的にブラウザ世代が変わっても挙動はそれほど変わらない。基礎がおろそかになっているとバグかな?という状況がでてくる。