Я работаю на мониторе большего размера, и сразу же, когда я открывал свой веб-сайт на моем ноутбуке, я сразу понял, что мое изображение не изменило свой размер рядом с моим div, а на самом деле поставило его под себя? Что мне делать??
Я уже пытался найти ответы в Интернете, но мне не очень повезло, что сайт кажется или работает идеально в основном только на моем мониторе, но в любом случае меньше, и фотография начинается с go под текстом.
Я довольно новичок во всем этом, приобретая новые навыки, находясь в режиме блокировки, так что не бейте слишком сильно, чтобы любой плохой код только пытался понять это
html, body {
background-color: #fffaee;
background-attachment: fixed;
-webkit-background-size: cover;
-moz-background-size: cover;
-o-background-size: cover;
background-size: cover;
font-family: 'Josefin Slab', serif;
}
#container {
position: fixed;
float: left;
background: ;
width: 424px;
color: #000000;
padding: 15px
}
h1 {
font-size: 4vw
}
h2{
background: #75c1f6;
color:black;
padding: 5px;
border-radius: 5px;
}
p{
font-size: 20px
}
a {
color:#75c1f6;
text-decoration: none;
}
footer {
position: fixed;
left: 0;
bottom: 0;
width: 100%;
text-align: center;
}
#man {
float: right;
}
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="keywords" content="prank, pigeons, old man, interactive, art, teague, portfolio">
<meta name="description" content="Frank loves to feed pigeons on his bench this is where he stays">
<title>Frank</title>
<link rel="shortcut icon" type="image/jpg" href="images/favicon.png">
<link rel="stylesheet" href="css/normalize.css">
<link rel="stylesheet" href="css/style.css">
<link href="https://fonts.googleapis.com/css2?family=Josefin+Slab:wght@700&display=swap" rel="stylesheet">
</head>
<body>
<div id="wrapper"></div>
<div id="container">
<h1>This Is Frank...</h1>
<h2></h2>
<P>Franks best friend is a pigeon.</P>
<P>Frank wakes up every morning puts on his loafs and heads to the park to feed his friend.</P>
<P>You've seen the old man on the park bench almost everyday while on your commute to work.</P>
<p>One day while walking to work you stop to ask the old man how he's doing. He mumbles "His
name is Roger, help me feed him!" </p>
</div>
<div id="man">
<img src="images/grandpasmall.gif" alt="Old man on bench">
</div>
<footer>
<a href="https://www.instagram.com/zed.head/" target="_blank">
<img src="images/social-insta.png" alt="instagram">
</a>
</footer>
</body>
</html>