locked
Text box width in vs 2017 RRS feed

  • Question

  • User-1578974752 posted

    I am using Visual studio 2017.(VB) Created a project using ASP.NET Web Application(.NET Framework). I have added new webform with Master page. Masterpage is site1.master .

    The Problem is when I increase the width of textbox  ,width is not increasing .Showing default size itself. Height If I increase ,In browser it is showing as increase height.But width can not.

    How can I increase the width of textbox.If I add webform with out master form,the text width is increased as I change. But I need Master page also.so how to solve that

    Thanks

    Friday, June 22, 2018 9:43 AM

Answers

  • User36583972 posted


    Hi shsu,

    Below is my Masterpage(Site.Master).If I take a new projectand add a webform with masterpage...still textbox size is not changing in its width.

    You have to use the default Site.Master. It has used some own style. When you use browser development tools to see the properties of the textbox. You can find the textarea property is control the width display.

    You can try the following solution. Rewriting the textarea style.

      <style type="text/css">
            .auto-style1 {
                width: 1167px;
                margin-left: 0px;
            }
    
            .auto-style2 {
                height: 35px;
            }
    
            .auto-style3 {
                height: 408px;
            }
    
            /* Set widths on the form inputs since otherwise they're 100% wide */
            input,
            select,
            textarea {
                max-width: 600px;
            }
        </style>
    

    Best Regards,

    Yong Lu

    • Marked as answer by Anonymous Thursday, October 7, 2021 12:00 AM
    Monday, June 25, 2018 3:18 AM

All replies

  • User409696431 posted

    How are you changing the width?  What code in your master page is overriding that?   We can't tell these answers from your post - you have to add more information.  Show us the minimum code to answer them.  (Or use browser development tools to see the properties of the textbox, and where they come from, to find out the answer on your own.)

    Saturday, June 23, 2018 6:28 PM
  • User-1578974752 posted

    Below is my Masterpage(Site.Master).If I take a new projectand add a webform with masterpage...still textbox size is not changing in its width.

    <%@ Master Language="VB" AutoEventWireup="true" CodeBehind="Site.master.vb" Inherits="WebApplication2.SiteMaster" %>

    <!DOCTYPE html>

    <html lang="en">

    <head runat="server">

    <meta charset="utf-8" />

    <meta name="viewport" content="width=device-width, initial-scale=1.0" />

    <title><%: Page.Title %> </title>

    <asp:PlaceHolder runat="server">

    <%: Scripts.Render("~/bundles/modernizr") %>

    </asp:PlaceHolder>

    <webopt:bundlereference runat="server" path="~/Content/css" />

    <link href="~/favicon.ico" rel="shortcut icon" type="image/x-icon" />

    <style type="text/css">

    .auto-style1 {

    width: 1167px;

    margin-left: 0px;

    }

    .auto-style2 {

    height: 35px;

    }

    .auto-style3 {

    height: 408px;

    }

    </style>

    </head>

    <body>

    <form runat="server">

    &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;

    <asp:ScriptManager runat="server">

    <Scripts>

    <%--To learn more about bundling scripts in ScriptManager see https://go.microsoft.com/fwlink/?LinkID=301884 --%>

    <%--Framework Scripts--%>

    <asp:ScriptReference Name="MsAjaxBundle" />

    <asp:ScriptReference Name="jquery" />

    <asp:ScriptReference Name="bootstrap" />

    <asp:ScriptReference Name="respond" />

    <asp:ScriptReference Name="WebForms.js" Assembly="System.Web" Path="~/Scripts/WebForms/WebForms.js" />

    <asp:ScriptReference Name="WebUIValidation.js" Assembly="System.Web" Path="~/Scripts/WebForms/WebUIValidation.js" />

    <asp:ScriptReference Name="MenuStandards.js" Assembly="System.Web" Path="~/Scripts/WebForms/MenuStandards.js" />

    <asp:ScriptReference Name="GridView.js" Assembly="System.Web" Path="~/Scripts/WebForms/GridView.js" />

    <asp:ScriptReference Name="DetailsView.js" Assembly="System.Web" Path="~/Scripts/WebForms/DetailsView.js" />

    <asp:ScriptReference Name="TreeView.js" Assembly="System.Web" Path="~/Scripts/WebForms/TreeView.js" />

    <asp:ScriptReference Name="WebParts.js" Assembly="System.Web" Path="~/Scripts/WebForms/WebParts.js" />

    <asp:ScriptReference Name="Focus.js" Assembly="System.Web" Path="~/Scripts/WebForms/Focus.js" />

    <asp:ScriptReference Name="WebFormsBundle" />

    <%--Site Scripts--%>

    </Scripts>

    </asp:ScriptManager>

    <table cellSpacing="1" cellPadding="3" height = "50" border="0" align=center valign=top class="auto-style1" >

    <!-- site header -->

    <tr>

    <td colspan="2" align="left" class="auto-style2">

    <asp:Image ID="Image2" runat="server" ImageUrl="~/headerw.jpg" Width="964px" />

    </td>

    </tr>

    <tr>

    <td valign="top" align="left" class="nav" style="width: 1170px; height: 20px;">

    <!-- this is the placeholder for the page content -->

    <StaticItemTemplate>

    <%# Eval("Text") %>

    </StaticItemTemplate>

    <DynamicHoverStyle BackColor="Silver" />

    </asp:Menu>

    </td>

    </tr>

    </table>

    <div class="container body-content">

    <asp:ContentPlaceHolder ID="MainContent" runat="server">

    <p class="auto-style3">

    <br />

    </p>

    </asp:ContentPlaceHolder>

    <footer>

    <asp:Image ID="Image3" runat="server" ImageUrl="~/footer.jpg" />

    </footer>

    </div>

    </form>

    </body>

    </html>

    In the web form

    <asp:Content ID="Content1" ContentPlaceHolderID="MainContent" runat="server">

         <asp:Panel ID="Panel1" runat="server" BackColor="PowderBlue" BorderStyle="None" Height="835px" Width="1250px">
          
          
             <asp:TextBox ID="TextBox1" runat="server" Width="508px"></asp:TextBox>
          
          
        </asp:Panel>
       

    </asp:Content>

    Monday, June 25, 2018 1:48 AM
  • User409696431 posted

    There is nothing there that would explain why your textbox isn't 508px. 

    <asp:TextBox ID="TextBox1" runat="server" Width="508px"></asp:TextBox>

    Of course we don't know what is in your bundled CSS or scripts, but that textbox should render as an input with an inline style of width=508px.   Does it?  Use your browser tools to see what is happening.  Or post a link to the page so we can see it.

    Monday, June 25, 2018 3:05 AM
  • User36583972 posted


    Hi shsu,

    Below is my Masterpage(Site.Master).If I take a new projectand add a webform with masterpage...still textbox size is not changing in its width.

    You have to use the default Site.Master. It has used some own style. When you use browser development tools to see the properties of the textbox. You can find the textarea property is control the width display.

    You can try the following solution. Rewriting the textarea style.

      <style type="text/css">
            .auto-style1 {
                width: 1167px;
                margin-left: 0px;
            }
    
            .auto-style2 {
                height: 35px;
            }
    
            .auto-style3 {
                height: 408px;
            }
    
            /* Set widths on the form inputs since otherwise they're 100% wide */
            input,
            select,
            textarea {
                max-width: 600px;
            }
        </style>
    

    Best Regards,

    Yong Lu

    • Marked as answer by Anonymous Thursday, October 7, 2021 12:00 AM
    Monday, June 25, 2018 3:18 AM