Align label to centre and left positions in DIV

Following css will give your expected result:

div {
    text-align: center;
}
#orderName {
    vertical-align: middle;
}
#orderNo {
    float: left;
}

 <div id="mydiv">
        <label id="orderName" >Order Name</label>
        <label id="orderNo">Order No</label>  
    </div>

Solution 2:

Other way using display:flex. Here i have added height and border to display vertical center.

And give margin:0 auto; to center.

div {
    align-items: center;
    display: flex;
    height: 40px;
    border: 1px solid;
}


#orderName {
    order: 2;
    margin:0 auto;
}

<div id="mydiv">
        <label id="orderName" >Order Name</label>
        <label id="orderNo">Order No</label>  
    </div>

Related