place select elements next to each other

How do I position two or more tags text to each other? I think the issue is just one simple tag in the CSS but I have been looking at forums for a good hour now and can't find a solution. all I want is something like this:

BOX BOX BOX

But what I'm getting is that the modules are stacked on top of eatch other rather than side to side. This is the core I've used so far:

.apply_form-birthdatemonth {    position: relative;    font-size:20px;    text-align: left;    left:37%;    padding-bottom: 20px;  }    .input-month {    display:block;    width: 10%;    border: 1px solid rgb(70, 70, 70);    border-radius: 0px;    padding: 15px 20px;  }    .apply_form-birthdateday {    position: relative;    font-size:20px;    text-align: left;    left:48%;    padding-bottom: 20px;    flex: 1;  }    .input-day{    display:block;    width: 10%;    border: 1px solid rgb(70, 70, 70);    border-radius: 0px;    padding: 15px 20px;    left:48%;  }    .apply_form-birthdateyear {    position: relative;    font-size:20px;    text-align: left;    left:59%;    padding-bottom: 20px;  }    .input-year{    display:block;    width: 10%;    border: 1px solid rgb(70, 70, 70);    border-radius: 0px;    padding: 15px 20px;  }

<div class="apply_form-birthdatemonth">              <select class="input-month">                  <option>Month</option>                  <option>January</option>              </select>          </div>            <div class="apply_form-birthdateday">              <select class="input-day">                  <option>Day</option>                  <option>1</option>                  <option>2</option>              </select>          </div>            <div class="apply_form-birthdateyear">              <select class="input-year">                  <option>Year</option>                  <option>2021</option>              </select>          </div>

https://stackoverflow.com/questions/66924813/place-select-elements-next-to-each-other April 03, 2021 at 04:22AM