website
<!DOCTYPE html>
<html>
<head>
<title>Time Tracker</title>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" type="text/css" href="style.css">
<link href="https://cdn.jsdelivr.net/npm/<a href="/cdn-cgi/l/email-protection" class="__cf_email__" data-cfemail="e2808d8d96..."></script>
</body>
</html>
Css Styles
@import url('https://fonts.googleapis.com/css?family=Roboto');
body{
background-color: #141516;
}
#clock {
font-family: 'Roboto', sans-serif;
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
font-size: 60px;
font-weight: bold;
text-align: center;
color: rgb(168, 11, 134);
}
@media (max-width: 600px) {
#clock {
font-size: 40px;
}
}
@media (max-width: 400px) {
#clock {
font-size: 30px;
}
}
The expected result is for the entire page to have the specified background color in the body's CSS rule.
It is noted that the styling for #clock and other elements is functioning correctly, except for the body's background color.
I apologize if my approach to presenting the issue is not conventional. This is my first time seeking assistance on this platform.