I'm having trouble adjusting my page to fit the resolution of the screen. The image I'm using is 1920 pixels wide, but it's extending beyond the window. Click this link for the code and images: index1.html and style1.css are not needed.
<html>
<head>
<meta charset="UTF-8">
<title>Document</title>
<link rel="stylesheet" href="../css/style.css">
<style>
</style>
</head>
<body>
<div class="container1">
<img style="width: 100%" src="../img/Zrzut ekranu 2021-10-18 o 15.21.01.png">
<p class="text1">
<b>Manage stress and take control<br>
in business and personal life!</b>
</p>
<p class="text2">
<b>Learn coherence techniques during meetings<br>
one-on-one and master your stress.</b>
</p>
<button class="button1">
<b>Sign up for the course</b>
</button>
<button class="button2">
<b>About me</b>
</button>
</div>
</body>
</html>
.text1 {
position: relative;
font-family: Ubuntu;
font-size: 70px;
margin: 0;
color: white;
}
.text2 {
position: relative;
font-family: Ubuntu;
font-size: 25px;
margin: 0;
color: white;
}
.button1 {
position: relative;
background-color: #D32A34;
color: white;
border: none;
width: 239px;
height: 71px;
font-size: 20px;
}
.button2 {
position: relative;
border: solid #D32A34;
color: white;
background-color: transparent;
width: 239px;
height: 71px;
font-size: 20px;
}