Сохранять ширину даже при изменении столбца. (HTML)

Question

У меня есть логин на левой боковой панели моего сайта. Когда пользователь вошел в систему, ширина боковой панели не остается такой же, как и когда пользователь не вошел в систему.

Есть ли способ сохранить ширину такой же?

<!-- Start Sidebar --> 
      <td id="sidebar" valign="top" height="400px" style="width: 200px"> 
       <!-- Login Form --> 
       <table id="TABLE2"> 
        <tr> 
         <td valign="top"> 
          <asp:LoginView ID="LoginView1" runat="server"> 
           <LoggedInTemplate> 
            <br /> 
            <br /> 
            You are currently logged in. 
           </LoggedInTemplate> 
           <AnonymousTemplate> 
            <asp:Login ID="Login1" runat="server" BorderPadding="0" BorderStyle="None" BorderWidth="0px" 
             Font-Names="Verdana" Font-Size="0.8em" CreateUserText="Sign Up Now!" CreateUserUrl="http://www.tiltonindustries.com/Tilton/Login/CreateAccount.aspx" 
             Height="1px" PasswordRecoveryText="Forgot your password?" PasswordRecoveryUrl="http://www.tiltonindustries.com/Tilton/Login/ForgotPassword.aspx" 
             TextLayout="TextOnTop" Width="200px" DestinationPageUrl="http://www.tiltonindustries.com/Tilton/default.aspx"> 
             <TitleTextStyle Font-Bold="True" Font-Size="0.9em"/> 
             <InstructionTextStyle Font-Italic="True" ForeColor="Black" /> 
             <TextBoxStyle Font-Size="0.8em" /> 
             <LoginButtonStyle BorderStyle="Solid" BorderWidth="1px" Font-Names="Verdana" Font-Size="0.8em" 
              ForeColor="#990000" /> 
             <LayoutTemplate> 
              <table border="0" cellpadding="4" cellspacing="0" style="border-collapse: collapse; 
               height: 159px;"> 
               <tr> 
                <td style="height: 176px; width: 135px;"> 
                 <table border="0" cellpadding="0" style="width: 219px; height: 1px" id="TABLE1"> 
                  <tr> 
                   <td align="center" style="font-weight: bold; font-size: 0.9em; color: white; height: 18px; 
                    background-color: #990000; text-align: center" colspan="2"> 
                    Log In</td> 
                  </tr> 
                  <tr> 
                   <td style="width: 94px; height: 10px;"> 
                   </td> 
                   <td style="height: 10px; width: 78px;"> 
                   </td> 
                  </tr> 
                  <tr> 
                   <td style="width: 94px; height: 20px; text-align: right"> 
                    <asp:Label ID="UserNameLabel" runat="server" AssociatedControlID="UserName">User Name:</asp:Label> 
                    &nbsp; 
                   </td> 
                   <td style="height: 20px; text-align: left; width: 78px;"> 
                    <asp:TextBox ID="UserName" runat="server" Font-Size="0.9em" EnableViewState="False" 
                     Width="100px" MaxLength="20"></asp:TextBox><asp:RequiredFieldValidator ID="UserNameRequired" 
                      runat="server" ControlToValidate="UserName" ErrorMessage="User Name is required." 
                      ToolTip="User Name is required." ValidationGroup="ctl01$Login1">*</asp:RequiredFieldValidator></td> 
                  </tr> 
                  <tr> 
                   <td style="width: 94px; text-align: right"> 
                    <asp:Label ID="PasswordLabel" runat="server" AssociatedControlID="Password">Password:</asp:Label> 
                    &nbsp; 
                   </td> 
                   <td style="text-align: left; width: 78px;"> 
                    <asp:TextBox ID="Password" runat="server" Font-Size="0.9em" TextMode="Password" Width="100px"></asp:TextBox><asp:RequiredFieldValidator 
                     ID="PasswordRequired" runat="server" ControlToValidate="Password" ErrorMessage="Password is required." 
                     ToolTip="Password is required." ValidationGroup="ctl01$Login1">*</asp:RequiredFieldValidator></td> 
                  </tr> 
                  <tr> 
                   <td style="height: 20px; width: 94px;"> 
                    &nbsp;</td> 
                   <td style="height: 20px; text-align: left; width: 78px;"> 
                    <asp:CheckBox ID="chkRememberMe" runat="server" Text="Remember Me" Width="104px" /></td> 
                  </tr> 
                  <tr> 
                   <td align="center" style="color: red; width: 94px; height: 20px;"> 
                   </td> 
                   <td align="center" style="color: red; text-align: left; width: 78px; height: 20px;"> 
                    <asp:Button ID="LoginButton" runat="server" BorderStyle="Solid" BorderWidth="1px" 
                     CommandName="Login" Font-Names="Verdana" Font-Size="1.0 em" Text="Log In" ValidationGroup="ctl01$Login1" 
                     Width="59px" BackColor="Gray" BorderColor="Black" Height="20px" /></td> 
                  </tr> 
                  <tr> 
                   <td align="center" style="width: 250px; color: red; height: 35px; text-align: center;" 
                    colspan="2"> 
                    <asp:Literal ID="FailureText" runat="server" EnableViewState="False"></asp:Literal></td> 
                  </tr> 
                  <tr> 
                   <td style="height: 26px; width: 94px;"> 
                    <asp:HyperLink ID="CreateUserLink" runat="server" NavigateUrl="http://www.tiltonindustries.com/Tilton/Login/CreateAccount.aspx">Sign Up Now!</asp:HyperLink>&nbsp; 
                   </td> 
                   <td style="width: 78px; height: 26px"> 
                    <asp:HyperLink ID="PasswordRecoveryLink" runat="server" NavigateUrl="http://www.tiltonindustries.com/Tilton/Login/ForgotPassword.aspx">Forgot your password?</asp:HyperLink></td> 
                  </tr> 
                 </table> 
                </td> 
               </tr> 
              </table> 
             </LayoutTemplate> 
            </asp:Login> 
           </AnonymousTemplate> 
          </asp:LoginView> 
          <!-- End Login Form --> 
          <!-- Quick Links --> 
          <br /> 
          <br /> 
          <p style="font-size: 14px; font-weight: bold; color: White"> 
           Quick Links:<br /> 
          </p> 
          <br /> 
          <p id="quicklinks"> 
           <a href="default.aspx">Home</a><br /> 
           <a href="services.aspx">Services</a><br /> 
           <a href="matching.aspx">Color Matching</a><br /> 
           <a href="packaging.aspx">Custom Packaging</a><br /> 
           <a href="decorals.aspx">Decorals</a><br /> 
           <a href="delivery.aspx">Delivery</a><br /> 
           <a href="items.aspx">Items</a><br /> 
           <a href="msds.aspx">MSDS</a><br /> 
           <a href="plant.aspx">Plant Capabilities</a><br /> 
           <a href="standard.aspx">Standard Colors</a><br /> 
           <a href="special.aspx">Special Effects</a><br /> 
           <a href="coatings.aspx">Spray Coatings</a><br /> 
           <a href="warranty.aspx">Warranty</a><br /> 
           <a href="http://www.tiltonindustries.com/Tilton/Login/Login.aspx">My Account</a><br /> 
           <a href="gallery.aspx">Gallery</a><br /> 
           <a href="about.aspx">About</a><br /> 
           <a href="faq.aspx">F.A.Q</a><br /> 
           <a href="links.aspx">Links</a><br /> 
           <a href="careers.aspx">Careers</a><br /> 
           <a href="contact.aspx">Contact</a><br /> 
           <br /> 
          </p> 
         </td> 
        </tr> 
       </table> 
      </td> 
      <!-- End Sidebar --> 

Answer 1

Если разметка такая же, вы всегда можете просто добавить фиксированную ширину к нему в CSS:

<div id="sidebar"> 
... 
</div> 

#sidebar { width: 200px; } 

Это, конечно, предполагает разметку для боковой панели само по себе является таким же, как при входе в систему и при ее отсутствии.

... предполагая, что вы используете нестандартную компоновку. Вы по-прежнему можете установить фиксированную ширину на боковой панели, но таблицы, как правило, не должны использоваться для целей макета.

Редактировать: А, есть код. Я советую вам прочитать CSS («учебник CSS» и т. П.) И удалить все атрибуты стиля из вашего кода. То, как он выглядит сегодня, делает его действительно, действительно нечитаемым и не очень легко изменчивым.