CSS孩子的div父

Question

這是父DIV外：

.navi { 
    width: 400px; 
    height: 30px; 
    float: right; 
    border-style: solid; 
    border-width: 1px; 
    border-color: #C0C0C0; 
    overflow: hidden; 
} 

而這些孩子的div內：

.aktuelleseite { 
    display: inline-block; 
    width: 20px; 
    height: 20px; 
    border-style: solid; 
    border-width: 1px; 
    border-color: #C0C0C0; 
    text-align: center; 
    color: white; 
    background-color: #404040; 
} 

.blatt { 
    display: inline-block; 
    width: 19px; 
    height: 20px; 
    border-style: solid; 
    border-width: 1px; 
    border-color: #C0C0C0; 
    text-align: center; 
    color: #404040; 
    text-decoration: none; 
} 

他們鬧翻了父DIV的，我該怎麼做他們總是呆在裏面呢？

這是function.php的一部分

if(!in_array(1,$blaetter) AND count($blaetter) > 1) 
     { 
     if(!in_array(2,$blaetter)) { echo '<a href="http://www.stylechica.de/hosen/' . $navi . '" class="blatt">1</a>...'; } 
     else { echo '<a href="http://www.stylechica.de/hosen/' . $navi . '">1</a>'; } 
     } 

    foreach($blaetter AS $blatt) 
     { 
     if($blatt == $seite) { echo '<div class="aktuelleseite">' . $blatt . '</div>'; } 
     else { echo '<a href="http://www.stylechica.de/hosen/' . $navi . 'seite-' . $blatt . '/" class="blatt">' . $blatt . '</a>'; } 
     } 

    if(!in_array($maxseite,$blaetter) AND count($blaetter) > 1) 
     { 
     if(!in_array(($maxseite-1),$blaetter)) { echo '...<a href="http://www.stylechica.de/hosen/' . $navi . 'seite-' . $maxseite . '/" class="blatt">' . $maxseite . '</a>'; } 
     else { echo '<a href="http://www.stylechica.de/hosen/' . $navi . 'seite-' . $maxseite . '/" class="blatt">' . $maxseite . '</a>'; } 
     } 

    } 
?> </div> 

我把它叫做：

<?php 
$wieviele_seiten = $json_output["ProductsSummary"]["TotalPages"]; 
$navi = blaetterfunktion($seite, $wieviele_seiten); 
echo $navi; 
?> 

你可以看到他在這裏得到：www.stylechica.de/hosen如果不loeads理由重新加載它，有時API會產生問題

Answer 1

您已將width設置爲子元素。嘗試：

.aktuelleseite { 
    display: inline-block; 
    height: 20px; 
    border-style: solid; 
    border-width: 1px; 
    border-color: #C0C0C0; 
    text-align: center; 
    color: white; 
    background-color: #404040; 
} 

.blatt { 
    display: inline-block;  
    height: 20px; 
    border-style: solid; 
    border-width: 1px; 
    border-color: #C0C0C0; 
    text-align: center; 
    color: #404040; 
    text-decoration: none; 
} 

Try it in fiddle