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>
