There seems to be an issue with the image on my webpage - it's displaying a broken page icon instead of the actual image, even though it was showing fine before. The image name and location have not been changed.
I'm also having trouble creating a button, as it's not appearing on the page.
Below is the HTML code:
<!DOCTYPE html>
<html>
<head>
<title>Title</title>
<link href="design.css" rel="stylesheet" type="text/css" />
</head>
<body>
<div id="pic">
<img src="C:\Users\A\Desktop\Untitled.jpg" id="pic">
</div>
<div class='banner'>
</div>
<div class="button">
</div>
</body>
</html>
And here is the CSS code:
#pic {
position: absolute;
margin-left: 40px;
margin-top: 4px;
z-index: 1;
}
.banner {
height: 100px;
width: 100%;
background-color: #FFFFFF;
position: absolute;
top: 0;
left: 0;
z-index: 0;
}
.button {
height: 50px;
width: 120px;
background-color: #BCD2EE;
border-color: #6495ED;
z-index: 3;
}
Body {
background-color: #E8E8E8;
}
Currently, only the white banner at the top and the grey background are visible on the page. The image shows a broken page icon and the button is not being rendered as intended.