begrenzen Sie die Breite des Fortschrittsbalken in twitter bootstrap
Ich bin mit twitter bootstrap, spice up meine Benutzeroberfläche . Ich bin wirklich geneigt, fügen Sie eine Fortschritt-bar auf meiner Seite . Das folgende funktioniert einwandfrei außer das die Statusleiste erstreckt sich über die gesamte Breite des Bildschirms . ich möchte es nur auf eine kleine rechteckige Fläche, anstatt die gesamte Länge des Bildschirms . Keine Ahnung, wie es zu tun ?
<div class="left" >
<p> <strong>Use the portal to submit your claims</strong></p>
<p> Step 1 </p>
<div class="progress progress-info">
<div class="bar" style="width: 15%" ></div>
</div>
<p> Step 2 </p>
<div class="progress progress-info">
<div class="bar" style="width: 30%"></div>
</div>
<p> Step 3 </p>
<div class="progress progress-info">
<div class="bar" style="width: 45%"></div>
</div>
</div>- Sicherlich würden Sie nur machen, enthält der DIV mit der Klasse von 'Links' auf es die Breite, die Sie möchten, es zu sein? Wenn Sie mit Bootstrap grid-system, dann würden Sie verwenden die entsprechenden 'span' - Klasse mit einer Zeile und einem container.
- Ich habe, was du meinst .Ich habe es getan ! ich bin neu in CSS & html-und dies ist meine erste webapp . danke . Sie können die oben als Antwort werde ich es annehmen 🙂
- Keine Sorge, froh, eine Hilfe sein.
Schreibe einen Kommentar
Du musst angemeldet sein, um einen Kommentar abzugeben.
Machen nur die mit DIV mit der Klasse von 'Links' auf es die Breite, die Sie möchten, es zu sein.
Wenn Sie mit Bootstrap grid-system, dann würden Sie verwenden die entsprechenden 'span' - Klasse mit einer Zeile und einem container.
<div class="container"> <h3>Step 2 / 8</h3> <div class="progress"> <div class="progress-bar" role="progressbar" aria-valuenow="30" aria-valuemin="0" aria-valuemax="100" style="width: 25%"> <span class="sr-only">25% Complete</span> </div> </div> </div>Macht sich gut in firefox aber nicht in chrome und edge.