Wie man ein Element zwischen einem anderen Element und dem Rand des Behälters zentriert

Question

Ich habe versucht, die erste Taste zwischen der zweiten und der rechten Kante mit margin:0 auto; dann margin-left:auto; margin-right:auto; aber vergeblich zu zentrieren. Was ist der beste Weg, dies zu erreichen?

<nav class="bg">  
    <button>Button 1</button> 
    <button>Button 2</button> 
    <button id="center">Button 3</button> 
</nav> 

https://jsfiddle.net/gabewest1/1915gwmy/1/

Answer 1

https://jsfiddle.net/1915gwmy/2/ Überprüfung dieser aktualisierten Code

.bg { 
    background-color:black; 
    text-align:center; 
} 
#center { 
    margin:auto; 
    background-color:green; 
} 
button { 
    float:left; 
    margin-right: 5px; 
} 
button:last-child { 
    float:none; 
    margin-right: 0; 
}