display bootstrap navbar in responsive

Last Reply 7 days ago By dharmendr

Posted 11 days ago

hi

I used below code for navbar:

  <div class="row">
                                <div class="col-sm-12">
                                    <div class="col-sm-6">
                                    <nav class="navbar navbar-default navbar-inverse" role="navigation">
            <div class="navbar-header">
                <button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#collapse">
                    <span class="sr-only">Toggle navigation</span>
                    <span class="icon-bar"></span>
                    <span class="icon-bar"></span>
                    <span class="icon-bar"></span>
                </button>
            </div>
            <div class="collapse navbar-collapse" id="collapse">
                <ul class="nav navbar-nav">
                    <li><a href="#">لیست املاک</a></li>
                    <li><a href="#">سپردن ملک</a></li>
                    <li class="active"><a href="#">درخواست ملک</a></li>
                    <li><a href="#">مشاوران شما</a></li>
                    <li><a href="#">درباره ما</a></li>
                    <li><a href="#">تماس با ما</a></li>
                </ul>
            </div>
        </nav>

</div>

                                 <div class="col-sm-6">
                                    <div class="col-lg-12" id="BDDateM">
                                         <div id="TH31">
                                                <asp:Image ID="Image10" runat="server" ImageUrl="~/Image/main/phone.png" CssClass="BphoneM"></asp:Image>
                                                    <div id="BTH31R">
                                                        <span class="blinking">44500991</span>
                                                        <asp:Label ID="Label3" runat="server" CssClass="dateMN">10 خط</asp:Label>
                                          </div>
                                     </div>
                                  </div>


                                    

</div>
                                    </div>
                                     </div>
                          
                   <div class="row">           

                          <div class="col-lg-6">

                                <div id="DDtyp">
                                     <asp:Label ID="Label30" runat="server" CssClass="lbltypeM">نوع ملک:</asp:Label>
                                             <asp:UpdatePanel ID="UpdatePanel4" runat="server">
                                                    <ContentTemplate>
                                                        <asp:DropDownList ID="DdltypeM" runat="server" CssClass="ddtypeM" OnSelectedIndexChanged="ddltype_OSIC"
                                                        AutoPostBack="true"></asp:DropDownList>
                                                     </ContentTemplate>
                                             </asp:UpdatePanel>

                                   </div>
                           </div>
                   </div>

refer below video:

https://gofile.io/?c=08PM2L

 

as you see in video I wrote text with red color and use dropdownlist when I click on the navbar to collapse it push Items at bottom of the page and when it collapses, Items return to their place

what should I do for solving this problem?

Best regards

Neda

 

 

You are viewing reply posted by: nedash 9 days ago.
Posted 9 days ago

Hi Dharmendr

I changed code like you said please refer below video:

https://gofile.io/?c=NFPWeu

as you see when I click on navbar when it collapsed at first it goes under dropdownlist after that it comes  on it

Best regards

Neda