HTMLボタンのラップが止まらない

Question

ウェブページの上部近くに横に横に並べたHTML/CSSボタンがあります。ウェブページが通常の（フルスクリーン）と見なされてもブラウザウインドウのサイズを変更すると（つまりフルスクリーンではない）、ボタンは消滅し始めます。各ボタンは、ブラウザウィンドウの幅 - 範囲をボタンの上にドラッグし始めると、個別に消えます。私がこれを非常にうまく説明していない場合は、ここでそれを示す写真を示します。ボタンの上にドラッグする前に

：ボタンの上にドラッグした後

：

私は「フロートを含むことにより、スタックオーバーフロー上の同様の質問のための共通の修正を試してみました：左CSSクラスでは "white-space：nowrap"と表示されますが、ボタンはまだ折り返します。ボタンを作るための HTMLは次のとおりです。

<div class="buttons"> 
    <div onmousedown="return false"><a class="aBtn" href="DPS_Guitarspg3.html">Guitars</a></div> 
    <div onmousedown="return false"><a class="aBtn" href="DPS_Guitarspg4.html">Basses</a></div> 
    <div onmousedown="return false"><a class="aBtn" href="DPS_Guitarspg2.html">Our Philosophy</a></div> 
    <div onmousedown="return false"><a class="aBtn" href="DPS_Guitarspg5.html">Custom Orders</a></div> 
    <div onmousedown="return false"><a class="aBtn" href="DPS_Guitarspg6.html">Contact Us</a></div> 
    </div> 

「aBtn」クラスのCSSは次のとおりです。

.aBtn { 
    /*left-10 due to automated spaceing in browser*/ 
    text-decoration: none; 
    color:rgb(111,0,100); 
    background-color:rgb(0,0,5); 
    border:1px solid transparent; 
    font-family: "arial"; 
    padding:8px 40px; 
    width: auto; 
    height: 5%; 
    top:60px; 
    float: left; 
    white-space: nowrap; 
} 

任意の助けを事前に感謝し、感謝しています。

Answer 1

使用widthまたはmin-widthボタンクラスのブロックまたはインラインブロック

Answer 2

のいずれかにdisplayを設定するいずれかの私は、あなたの目標は、このために何であるかそうわからないんだけど、あなたは、むしろrightfloatにボタンを試みることができますleftより、それが違いを生むかどうかを確認してください。