<div class="footer">
<div class="button"> </div>
<div class="text">20.00</div>
</div>
.footer{
width:100%;
position:fixed;
height:200px;
background-color:red;
display: flex;
flex-direction: row;
align-items: center;
justify-content: space-between;
padding:0 10px; //padding
}
.button{
border:1px solid blue;
text-align:center;
line-height:40px;
width:80px;
height:40px;
}
when padding:0 10px; Why does the right 20.00 exceed browser editing on the right?