How to display title in the center of navigation bar without using padding-left

Question

I want to center the "title123" div element without using padding-left. I have tried fidgeting around with the css as you can see below but the title remains on the left end of the navigation bar. Any help/advice would be appreciated! Code below:

<nav class="navbar fixed-top navbar-expand-lg" style="background-color:black">
        <div class="title123">
            Title
        </div>
    </nav>

.title123 {
    font: bold;
    font-family: "Arial Black", Gadget, sans-serif;
    font-size: 28px;
    color: ghostwhite;
    display: block;
    text-align: center;
    float:right;
    vertical-align: top;
}

Answer 1

.navbar {
  display: block;
  text-align:center;
}

.title123 {
    font: bold;
    font-family: "Arial Black", Gadget, sans-serif;
    font-size: 28px;
    color: ghostwhite;
    display: inline-block;
    text-align: center;
}

Answer 2

.navbar { display: flex; justify-content: center;}