cssを使って、ボタンの位置をウィンドウサイズに合わせて適応させたい

Question

〇実現したい事
cssを使って、ボタンの位置をウィンドウサイズに合わせて適応させたい。

ここに質問の内容を詳しく書いてください。
htmlで簡単な目次を作成しています。
「戻る」ボタンを設置したのですが、想定通りの表示をするにはどのようにcssを指定したらよいでしょうか。
具体的には、ウィンドウが大きい時はcssで指定した位置に配置されます。
ウィンドウを小さくした際に、「戻るボタン」が画面の真ん中に表示されてしまいます。

他の要素の左上に設置したいので、その要素を基準に指定すればよいのかなと思いますが、調べてもうまくいきません。

よろしくお願いします。

※追記
作成途中なのですが、このような状態です。
【html】

<div class="button"> <a href="index.html">◀ 戻る</a><!-- .button--> </div>

【css】
.button a{
display: inline-block;
padding: 0.5em 1em;
text-decoration: none;/太文字/
position:relative;
top:180px;
left:450px;
}

.button a:active {
box-shadow: inset 0 0 2px rgba(128, 128, 128, 0.1);
transform: translateY(2px);

Comments

[azuapricot]

コードがなにもないので回答はできません。

まず質問するときは現状のコードをマークダウン形式(<code>）で提示してください。

[mimi_15]

すみません、どのようなコードを記載したら宜しいでしょうか

[azuapricot]

現時点でご自身が書いたコードは一つもないんですか？
HTMLやCSS，JSなど。

何もないところから教えてくれ、だとただのコード作成依頼です。

こういうふうに書いたんだけどここがエラーが出てうまくいかない、だとか
ここの処理がわからない、といったように具体的に質問しないと誰も回答してくれません

[mutsuki22]

制作している現状のコードの提示で大丈夫ですよ。

因みになんですが、タグ的にHTMLとCSSも追加したほうが良いかもです。

Answer 1

他の要素が何も提示されてないのでどうしたいのか分かりませんが、ウィンドウサイズでスタイルを変更するならメディアクエリが使えると思います。

メディアクエリの使用 - CSS: カスケーディングスタイルシート | MDN