In redesigning a simple survey page I am facing a minor problem. Just like all the other elements, I want to centre-align p tag with select tag. I am able to centre align them, without display:flex inside .combobox class but I want them to be in the same line and still centre-align them.
My present layout is like this:

To summarise, I want to centre the Select and Combobox.
body {
  text-align: center;
  margin: auto;
  font-family: Arial, Helvetica, sans-serif;
}
header {
  background-color: rgb(56, 65, 77);
  color: white;
  padding: 3%;
  font-size: 200%;
}
section {
  color: rgb(56, 65, 77);
  border-style: none;
}
.combobox {
  display: flex;
  flex: auto;
}
fieldset {
  border: none;
}
footer {
  background-color: rgb(56, 65, 77);
  color: white;
  padding: 1%;
  position: absolute;
  bottom: 0;
  width: 100%;
}
select {
  margin-top: 14px;
  margin-left: 5px;
}<header>SURVEY.COM</header>
<form method="POST">
  <section>
    <h1>Submit your Survey Today!</h1>
    <p>Your Name</p>
    <input type="text" id="name">
    <p>Your Email</p>
    <input type="text" id="email">
    <div class="combobox">
      <p>Select</p>
      <select name="cars" id="cars">
        <option value="volvo">Volvo</option>
        <option value="saab">Saab</option>
        <option value="mercedes">Mercedes</option>
        <option value="audi">Audi</option>
      </select>
    </div>
    <fieldset>
      <legend>What is Your Favorite Pet?</legend>
      <input class="checkbox" type="checkbox" name="favorite_pet" value="Cats">Cats
      <input class="checkbox" type="checkbox" name="favorite_pet" value="Dogs">Dogs
      <input class="checkbox" type="checkbox" name="favorite_pet" value="Birds">Birds
    </fieldset>
    <input type="submit" value="Submit now" />
  </section>
</form>
<footer>
  Copyright © 2021
</footer> 
    