前提・実現したいこと
HTML・CSSでゲームの攻略サイトを作っています。
ツールはvisual Studio codeです。
発生している問題・エラーメッセージ
画面を拡大・縮小すると、おかしくなります。
該当のソースコード
html・css
1<!DOCTYPE html> 2<html lang="ja"> 3<head> 4 <meta charset="UTF-8"> 5 <title>マインクラフト攻略.com</title> 6 <style> 7 body{ 8 background-color: whitesmoke; 9 background-position: center top; 10 background-repeat: no-repeat; 11 background-size: 810px; 12 background-repeat: repeat-y; 13} 14h1{ 15 text-align: left; 16 font-size: 35px; 17 border-bottom: solid #0bd; 18} 19.d{ 20 align-items: stretch; 21} 22.e{ 23 background: white; 24 color: black; 25 margin: 0% 266px; 26 height: auto; 27 padding: 10px 10px; 28} 29.f{ 30 border-style: inset; 31 border-width: 4px; 32 background: #333333; 33 color: white; 34 font-weight: lighter; 35} 36 </style> 37</head> 38<body> 39 <div class=d> 40 <div class=e> 41 <h1>【マイクラ】初心者必見!安定するまでの順序!</h1> 42 <h2> 43 皆さんこんにちは!マインクラフターの---です! 44 </h2> 45 <img src="a10aaaa.png" class="g"> 46 <h2> 47 <p> 48 今日はマインクラフトで序盤はどのようなことをすればいいのかをお教えします!ぜひ参考にしてください! 49 </p> 50 <p> 51 52 </p> 53 <p class="f"> 54目次 55 </p> 56 </h2> 57 </div> 58 </div> 59 <div class="b"> 60序盤にやっておきたいこと 61 </div class="c"> 62 <div class="b"> 63 建築がうまくなるコツ 64 </div> 65 <div class="b"> 66 おすすめMOD一覧 67 </div> 68 <div class="b"> 69 おすすめサーバー一覧 70 </div> 71 <div class="b"> 72 コマンド一覧 73 </div> 74</body> 75</html>
試したこと
私が知ってる限りのことはやりましいたが、直りません。
補足情報(FW/ツールのバージョンなど)
ツールはvisual Studio codeです。
>私が知ってる限りのことはやりましいたが、直りません。
みんな、あなたの知識を知りません
あなたの知っていることが何なのかも知りません
なので、知っている限りをもっと具体的に書かないとどこまで理解しているのか?解らないです。
100%で表示した場合と拡大・縮小をして表示した場合のスクリーンショットなどを載せて、何が問題なのかを具体的に表してもらえると回答がつきやすいかもしれません。
まぁまぁ、質問者さんはHTMLもteratailも初心者なんですから。
「`Ctrl`+スクロール」とか、「`Ctrl`+`+`」・「`Ctrl`+`-`」で拡大縮小したときにおかしくなるって話ですかね?
それとも、Webブラウザのウィンドウサイズを縮めてみるとおかしくなるって話ですかね?
質問を編集して、もうちょっと詳しい話を書いてみましょう。回答する人もだんだんあなたの伝えようとしていることがわかるようになってきます。
TatamiSteakさん
今日登録したユーザーだからと本当に初めての利用とは限りません。
もちろん本人以外知る由はないですが、初めてでも「それで伝わるか」は考えて投稿すべきかと思います。
> HTML・CSSで拡大縮小するとおかしくなります。
この現象がどのようなものか不明確ではありますが、marginの指定が絶対値指定だからなのでは?