I want the line containing “ New Subject“ to fill the full width of the window, with the text centred. This isn’t working. Why not? And how do I get it to work?
<!DOCTYPE html>
<html lang="en">
<head>
<style>
html body {width: 100%;} /* enable following content to fill full screen width */
div.subject:before {content: "New Subject";
font-weight: bold;
color: Yellow;
background-color: black;
width: 100%;
text-align:center;
}
div.subject {border-top: thick solid;}
</style>
<title>html & CSS learning</title>
</head>
<body>
<h1>Test</h1>
<p>Text before div</p>
<div class="subject">
<p>Text in the middle of div</p>
</div>
<p>Text after div</p>
</body>
</html>