Q&A
ご提示のCSSで表示してみましたけど、どこに問題がありますか？
https://codepen.io/itagagaki/pen/bGgyaGX
前提・実現したいこと
トップのページに画面幅いっぱに画像をおいて、ロゴとリンクを有効にしたい。
発生している問題・エラーメッセージ
エラーメッセージがでていない。
header figure {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100vh;
margin: 0;
}
header figure img {
width: 100%;
height: 100vh;
object-fit: cover;
background-position: center;
padding-top: 160px;
}
css
試したこと
リスポンシブなど、他の要素でひっかかっているかもしれないが、何が問題なのかがわからなくなった。
補足情報（FW/ツールのバージョンなど）
その他・・・
.logo h1 {
margin-left: 0px;
float: left;
}
.float ul {
display: inline-block;
margin-top: 5px;
margin-right: 0px;
float: right;
}
.float li {
display: inline-block;
list-style: none;
margin-right: 10px;
padding: 10px;
background: rgb(255, 255, 255);
color: rgb(24, 23, 23);
}
@media screen and (max-width: 767px) {
div.float {
text-align: center;
}
.float h1 {
display: block;
margin: 30px auto;
float: none;
}
.float ul {
width: 150px;
margin: 50px auto;
display: block;
float: none;
padding-left: 0;
}
.float li {
display: block;
margin: 5px auto;
border-bottom: 2px solid #2ac5b3;
}
}
header h1 {
margin: 0 0 0 0;
padding-top: 28px;
text-align: center;
}
nav ul {
display: flex;
justify-content: space-around;
list-style-type: none;
margin: 30px 0 10px 0;
padding-left: 0;
overflow: hidden;
}
a {
text-decoration: none;
}
コードやエラーはマークダウンのcode機能を利用してご提示ください。
https://teratail.com/questions/238564
>エラーメッセージがでていない。
HTMLやCSSなどは構文チェッカーにでもかけない限り見た目で分かるエラーは出ません。
「起きている問題」を明記しましょう。
あなたの回答
tips
プレビュー
