Why doesn't display:flex
work in my CSS code? I want this part of my HTML code to be in the center of the page.
body { margin: 0; display: flex auto 0 1; justify-content: center; height: 100vh; }
<form class="form" id="form"></form> <h4 class="score" id="score">score :0</h4> <h1 id="Question">What is 1 multiply by 1?</h1> <input type="text" class="input" id="input" placeholder="Enter your answer" autofocus autocomplete="off"> <button type="submit" class="btn">submit</button>
flex auto 0 1
is an invalid property value fordisplay
. Your browser's document inspector will show you this. You need to separate these values in thedisplay
andflex
properties.I suspect you also want
flex-direction: column
, but I'll leave that to you.score :0
What is 1 multiply by 1?