Wie positionieren Sie ein div (mit untergeordneten divs) horizontal zentriert auf der Seite?

Question

Ich würde gerne ein div horizontal auf der Seite zentrieren (das div enthält vier gauge wie radiale Zifferblätter, die nebeneinander und nicht eine Zeile nach der anderen sein müssen). Mein aktuelles CSS (unten) zeigt die Messgeräte nebeneinander an, so dass die float-Eigenschaft gut zu funktionieren scheint, aber die margin-Eigenschaft, die ich für das übergeordnete div (allgaues) eingestellt habe, scheint nicht effektiv zu sein. Hat die Tatsache, dass ich mehrere Divs innerhalb von "allgauges" habe, einen Unterschied, wenn ich versuche, sie auf die Mitte der Seite auszurichten? Jede Hilfe wird geschätzt.

<!-- Embedded style sheet to change the margin spacing between the gauges --> 
 
    <style> 
 
     
 
     
 
    #one, #two, #three, #four 
 
    { 
 
\t float: left; 
 
\t } 
 
\t 
 
    #allgauges 
 
    { 
 
\t \t margin: 0 auto; 
 
\t } 
 
     
 
    </style>

Answer 1

Diese Frage mehrfach beantwortet wurde. Hier ist die Lösung:

.one,.two, .three,.four 
 
{ 
 
    display:inline-block; 
 
    vertical-align:middle; 
 
    width:25%; 
 
    text-align:center; /* This is not necessary.*/ 
 
    font-size:13px; 
 
} 
 
\t 
 
.allgauges 
 
{ 
 
    font-size:0; 
 
}

<div class="allgauges"> 
 
    <div class="one">1</div> 
 
    <div class="two">2</div> 
 
    <div class="three">3</div> 
 
    <div class="four">4</div> 
 
</div>