title: Changing controls order in row class div bootstrap 3
body: <p>Well, I'am building a web application that uses twitter bootstrap 3 , and supports both languages English and Arabic with two different  master pages for each,
  am using <code>div</code> with class <code>.row</code> to put my controls inside
  controls inside rows by default starts from left to right
  when I change my website language to Arabic I want to reverse all items inside rows from right to left
  am changing the master page with my stylesheet files, I've tried floating and directions but it never works for me for items inside div with <code>.row</code> class</p>
  
  <pre><code>&lt;asp:Panel ID="pnl_TaskContent" runat="server" class="row"&gt;
                    &lt;asp:Panel ID="pnl_TaskColumn" runat="server" class="col-md-12"&gt;
                        &lt;div class="box-body"&gt;
                            &lt;div class="row"&gt;
                                &lt;div class="col-md-3"&gt;
                                    &lt;%--Task Name--%&gt;
                                    &lt;div class="form-group"&gt;
                                        &lt;asp:Label ID="lbl_Task_Name" runat="server" Text="Task Name" Font-Bold="True" Font-Italic="False"&gt;&lt;/asp:Label&gt;
                                        &lt;div class="input-group"&gt;
                                            &lt;span class="input-group-addon"&gt;&lt;i class="fa fa-pencil"&gt;
                                                &lt;asp:RequiredFieldValidator ID="RequiredFieldValidator27" runat="server" ErrorMessage="*"
                                                    ControlToValidate="txt_Task_Name" ForeColor="Red" ValidationGroup="saveTask" Font-Bold="True" Font-Size="Medium"&gt;&lt;/asp:RequiredFieldValidator&gt;
                                            &lt;/i&gt;&lt;/span&gt;
                                            &lt;asp:TextBox ID="txt_Task_Name" runat="server" ClientIDMode="Static" CssClass="form-control"&gt;&lt;/asp:TextBox&gt;
                                            &lt;div class="input-group-btn"&gt;
                                                &lt;asp:Button ID="button_tf" CssClass="btn btn-default dropdown-toggle" runat="server" Text="Functions" data-toggle="dropdown" ValidationGroup="none" /&gt;
                                                &lt;ul class="dropdown-menu"&gt;
                                                    &lt;li&gt;
                                                        &lt;asp:Button ID="btn_AddTaskFunModal" CssClass="btn btn-default btn-block" runat="server" ValidationGroup="novali" Text="Add/Edit" data-toggle="modal" data-target="#addTaskFunctions-modal" /&gt;&lt;/li&gt;
                                                    &lt;li&gt;
                                                        &lt;asp:Button ID="btn_BrowseTaskFunModal" CssClass="btn btn-default btn-block" runat="server" ValidationGroup="novali" Text="Edit" data-toggle="modal" data-target="#BrowseTaskFunctions-modal" /&gt;&lt;/li&gt;
                                                &lt;/ul&gt;
                                            &lt;/div&gt;
                                        &lt;/div&gt;
                                    &lt;/div&gt;
                                &lt;/div&gt;
                                &lt;div class="col-md-3"&gt;
                                    &lt;%--Task Status--%&gt;
                                    &lt;div class="form-group"&gt;
                                        &lt;asp:Label ID="lbl_Task_Status" runat="server" Text="Task Status" Font-Bold="True" Font-Italic="False"&gt;&lt;/asp:Label&gt;
                                        &lt;div class="input-group"&gt;
                                            &lt;span class="input-group-addon"&gt;&lt;i class="fa fa-signal"&gt;
                                                &lt;asp:RequiredFieldValidator ID="RequiredFieldValidator11" runat="server" ErrorMessage="*"
                                                    ControlToValidate="ddl_Task_Status" ForeColor="Red" ValidationGroup="saveTask" Font-Bold="True" Font-Size="Medium"&gt;&lt;/asp:RequiredFieldValidator&gt;
                                            &lt;/i&gt;&lt;/span&gt;
                                            &lt;asp:DropDownList ID="ddl_Task_Status" runat="server" ClientIDMode="Static" CssClass="form-control" Enabled="False"&gt;
                                                &lt;asp:ListItem Value="N"&gt;New&lt;/asp:ListItem&gt;
                                                &lt;asp:ListItem Value="A"&gt;Active&lt;/asp:ListItem&gt;
                                            &lt;/asp:DropDownList&gt;
                                        &lt;/div&gt;
                                    &lt;/div&gt;
                                &lt;/div&gt;
                                &lt;div class="col-md-3"&gt;
                                    &lt;%--Task Priority--%&gt;
                                    &lt;div class="form-group"&gt;
                                        &lt;asp:Label ID="lbl_Task_Proirity" runat="server" Text="Task Priority" Font-Bold="True" Font-Italic="False"&gt;&lt;/asp:Label&gt;
                                        &lt;div class="input-group"&gt;
                                            &lt;span class="input-group-addon"&gt;&lt;i class="fa fa-flag"&gt;
                                                &lt;asp:RequiredFieldValidator ID="RequiredFieldValidator12" runat="server" ErrorMessage="*"
                                                    ControlToValidate="ddl_Task_Proirity" ForeColor="Red" ValidationGroup="saveTask" Font-Bold="True" Font-Size="Medium"&gt;&lt;/asp:RequiredFieldValidator&gt;
                                            &lt;/i&gt;&lt;/span&gt;
                                            &lt;asp:DropDownList ID="ddl_Task_Proirity" runat="server" ClientIDMode="Static" CssClass="form-control"&gt;
                                                &lt;asp:ListItem Value="H"&gt;High&lt;/asp:ListItem&gt;
                                                &lt;asp:ListItem Value="M"&gt;Medium&lt;/asp:ListItem&gt;
                                                &lt;asp:ListItem Value="L"&gt;Low&lt;/asp:ListItem&gt;
                                            &lt;/asp:DropDownList&gt;
                                        &lt;/div&gt;
                                    &lt;/div&gt;
                                &lt;/div&gt;
                                &lt;div class="col-md-3"&gt;
                                    &lt;%--Completion Rate--%&gt;
                                    &lt;div class="form-group"&gt;
                                        &lt;asp:Label ID="lbl_Task_CompRate" runat="server" Text="Completion Rate" Font-Bold="True" Font-Italic="False"&gt;&lt;/asp:Label&gt;
                                        &lt;asp:RangeValidator ID="RangeValidator1" runat="server" ControlToValidate="txt_Task_CompRate" ErrorMessage="0-100" Font-Bold="True" ForeColor="Red" MaximumValue="100" MinimumValue="0" SetFocusOnError="True" Type="Integer" ValidationGroup="saveTask"&gt;&lt;/asp:RangeValidator&gt;
                                         &lt;div class="input-group"&gt;
                                            &lt;span class="input-group-addon"&gt;&lt;i class="fa fa-flag"&gt;
                                                &lt;asp:RequiredFieldValidator ID="RequiredFieldValidator31" runat="server" ErrorMessage="*"
                                                    ControlToValidate="txt_Task_CompRate" ForeColor="Red" Font-Bold="True" Font-Size="Medium" ValidationGroup="saveTask"&gt;&lt;/asp:RequiredFieldValidator&gt;
                                            &lt;/i&gt;&lt;/span&gt;
                                            &lt;asp:TextBox ID="txt_Task_CompRate" runat="server" ClientIDMode="Static" CssClass="form-control"&gt;0&lt;/asp:TextBox&gt;
                                                                                     &lt;span class="input-group-addon"&gt;&lt;i&gt;&lt;b&gt;%&lt;/b&gt;
                                            &lt;/i&gt;&lt;/span&gt;
                                              &lt;/div&gt;
                                    &lt;/div&gt;
                                &lt;/div&gt;
                            &lt;/div&gt;
  </code></pre>
  
  <p>what i want that when i change the display order to rtl, is to change the controls inside my row</p>
  
  <p><img src="https://i.stack.imgur.com/Z5vyU.png" alt="When Direction From Left To Right"></p>
  
  <p><img src="https://i.stack.imgur.com/cjX57.png" alt="When Direction From Left To Right but controls are not showing as expected"></p>
  
  <p><strong>When Direction From Left To Right but controls are not showing as expected</strong></p>