hrefで同じ.progressに複数のバーが機能していませんか？

Question

progress-bar-dangerは表示されていません。以下のhtmlを試してみましたが、動作しています。私はなぜそれが動作していないのか分からないのですか？おかげ

<div class="progress"> 
 
    <a href="/sample1"> 
 
     <div class="progress-bar progress-bar-success" style="width: 65%"> 
 
      <span>65%</span> 
 
     </div> 
 
    </a> 
 
    <a href="/sample2"> 
 
     <div class="progress-bar progress-bar-danger" style="width: 35%"> 
 
      <span>35%</span> 
 
     </div> 
 
    </a> 
 
</div>

...画面が&が示唆撃た参照してください。

Answer 1

まず第一に：あなたは2つの<a>要素を配置しているし、それらの中に、あなたがバーを配置しています％幅。

これは問題です。 <div>のクラスを親の<a>に配置する必要があり、スパンも消耗品になります。そのよう ：

<div class="progress"> 
    <a href="/sample1" class="progress-bar progress-bar-success" style="float:left;width:65%;display:block;"> 
      <span>65%</span> 
    </a> 
    <a href="/sample2" class="progress-bar progress-bar-danger" style="width: 35%;float:left;display:block;"> 
      <span>35%</span> 
    </a> 
</div> 

そうでない場合は、<a>内div sが65％とそのparent幅の35％となります。それが％幅の仕組みです。 %を使用して要素を隣り合わせに配置する場合は、同じ親コンテナ内にある必要があります。