5

Tôi đang sử dụng trình khởi động twitter cho trang web của mình. Tôi muốn sử dụng thanh tiến trình để cho biết phần trăm hoàn thành quá trình.align thanh tiến trình và thanh tiến trình khởi động twitter

Trong thanh tiến trình, tôi muốn hiển thị tên của bước đang xử lý và sử dụng huy hiệu ở cuối hoặc bắt đầu thanh tiến trình để hiển thị phần trăm hoàn tất. Dưới đây là liên kết fiddle JS cho những gì tôi đang cố gắng để làm

http://jsfiddle.net/KBTy7/12/

<div id="coolstuff" style="margin-top: 10px;"> 
    <span class="badge" style="padding: 3px; width: 10px">10%</span> 
    <div class="progress" id="prgbar"> 
     <div title="PO Details" class="bar" style="width: 20%;" id="prgwidth">Add New PO Detail</div> 
    </div><!-- end of progress bar --> 
</div> <!-- end of cool stuff --> 

Nhưng Bade và thanh tiến trình không được thẳng hàng cạnh nhau. Tôi không giỏi css nên tôi không chắc mình có thể làm gì để sắp xếp chúng trong cùng một hàng.

Trả lời

9

Hãy thử điều này - http://jsfiddle.net/KBTy7/412/

<html> 
    <body> 
     <div id="coolstuff" style="margin-top: 10px;"> 
      <span class="badge" style="padding: 3px; float: left; width: 25px; text-align: center;">10%</span> 
      <div class="progress" id="prgbar"> 
       <div title="PO Details" class="bar" style="width: 20%;" id="prgwidth"> Add New PO Detail </div> 
      </div><!-- end of progress bar --> 
     </div> <!-- end of cool stuff --> 
    </body> 
</html>​ 
+0

Làm việc một cách hoàn hảo ... Tôi sẽ nhớ thời gian tiếp theo "phao" :) Cảm ơn – Neel

+0

Nó không phải là cho phép tôi để đánh dấu nó như là một câu trả lời vì một số hạn chế thời gian .. sẽ làm một khi nó được nâng lên – Neel

+0

Từ "Thêm chi tiết PO mới" chỉ "Thêm" hiển thị .. – stej

Các vấn đề liên quan