Your colleague specified the <div>
block to be 100vw width.
He expected the block to be exactly as wide as the viewport.
He also added padding and border to the block.
The block has become wider than the viewport, which causes horizontal scrolling at the bottom.
Probably colleague completely forgot about the block model.
Without changing the existing styles, make the block 100vw wide.
This task is part of the Full-Stack JavaScript Course
If you have any issues with it, you can ask for community help below the post
Feel free to help others if you’ve already solved the task
index.html
<!DOCTYPE html>
<html>
<head>
<title>Box model</title>
<style>
body {
margin: 0px;
}
div {
border: 1px solid red;
width: 100vw;
padding: 10px 40px;
}
</style>
</head>
<body>
<div>
HTTP is a Client/Server communication model where the client makes a request to a server, and the server responds to that message.
</div>
</body>
</html>