locked
Progressbar with Bootstrap RRS feed

  • Question

  • User1510859543 posted

    We are using Bootstrap js and css in our asp.net web application and was wondering if someone could point me to an example of a progress bar. We have something now that works well on a desktop but not on a smartphone. Thanks.

    Monday, June 8, 2020 4:51 PM

Answers

  • User475983607 posted

    dlchase

    I was trying a Grid but the columns were stacking on a smartphone. Below is sample of the code I was trying. To keep small I am only showing 2 columns but want to have 7 columns total.

    There's no Bootstrap progress bar in the sample code.   Are you asking a new question?  Can you provide the subject?

    Do you need a link to the Bootstrap progress bar documentation?

    https://getbootstrap.com/docs/4.0/components/progress/

    • Marked as answer by Anonymous Thursday, October 7, 2021 12:00 AM
    Monday, June 8, 2020 7:04 PM

All replies

  • User475983607 posted

    We are using Bootstrap js and css in our asp.net web application and was wondering if someone could point me to an example of a progress bar. We have something now that works well on a desktop but not on a smartphone. Thanks.

    /  

    What progress are you measuring?  What is not working well and what is the definition of working well?  Do you have any code that illustrates what is not working?

    Monday, June 8, 2020 5:51 PM
  • User1510859543 posted

    I was trying a Grid but the columns were stacking on a smartphone. Below is sample of the code I was trying. To keep small I am only showing 2 columns but want to have 7 columns total.

        <asp:Panel ID="PanelStatus" runat="server">
            <div class="row">
                <div class="col-md-2" style="text-align: center; vertical-align: middle;">
                    <br />
                    <span>AWAITING<br />VEHICLE<br />DROP OFF</span>
                </div>
                <div class="col-md-2" style="text-align: center; vertical-align: middle;">
                    <span>REPAIRS<BR />STARTED:<BR />DISASSEMBLY &<BR />DAMAGE<BR />ANALYSIS</span>
                </div>
            </div>
            <div class="row">
                <div class="col-md-2" style="text-align: center; vertical-align: middle;">
                    <asp:Image ID="ImgCircle1" runat="server" ImageUrl="~/images/accept.png" onmouseover="showlist(1)" onmouseout="hidelist(1);" />
                    <asp:Image ID="ImgArrow1" runat="server" ImageUrl="~/images/arrow_right.png" />
                </div>
                <div class="col-md-2" style="text-align: center; vertical-align: middle;">
                    <asp:Image ID="ImgCircle2" runat="server" ImageUrl="~/images/acceptoff.png" onmouseover="showlist(2)" />
                    <asp:Image ID="ImgArrow2" runat="server" ImageUrl="~/images/arrow_right.png" />
                </div>
            </div>
        </asp:Panel>
    
    

    Monday, June 8, 2020 6:54 PM
  • User475983607 posted

    dlchase

    I was trying a Grid but the columns were stacking on a smartphone. Below is sample of the code I was trying. To keep small I am only showing 2 columns but want to have 7 columns total.

    There's no Bootstrap progress bar in the sample code.   Are you asking a new question?  Can you provide the subject?

    Do you need a link to the Bootstrap progress bar documentation?

    https://getbootstrap.com/docs/4.0/components/progress/

    • Marked as answer by Anonymous Thursday, October 7, 2021 12:00 AM
    Monday, June 8, 2020 7:04 PM