Go Premium for a chance to win a PS4. Enter to Win

x
  • Status: Solved
  • Priority: Medium
  • Security: Public
  • Views: 266
  • Last Modified:

How the width split between the Table cells and spaced in the OuterTable(80% width).

Please see the below .aspx source code. It is using the master page and skin ID's are given below.
How the width split between the Table cells and spaced in the OuterTable.
The tblUserDetails opened in the TableCell with columnspan="2"

Can you explain how the Tablecells width split in the 80% outerTable width.

%@ Page Language="C#" AutoEventWireup="true" MasterPageFile="~/Site.Master" CodeBehind="DisplayForm.aspx.cs" Inherits="MyApp.DisplayForm" %>
<asp:Content ID="Content1" ContentPlaceHolderID="HeadContent" runat="server">
</asp:Content>
<asp:Content ID="Content2" ContentPlaceHolderID="MainContent" runat="server">
    <asp:Table ID="tblOuterMain" runat="server" SkinID="OuterTableSkin">
        <asp:TableRow>
            <asp:TableCell>
                <asp:Table ID="tblHeader" runat="server" Width="100%">
                    <asp:TableHeaderRow SkinID="TableHeaderRowSkin">
                        <asp:TableHeaderCell SkinID="TableHeaderCellSkin">
                                                 user Information
                        </asp:TableHeaderCell>
                    </asp:TableHeaderRow>
                    <asp:TableRow SkinID="GeneralRowSkin" Width="100%">
                        <asp:TableCell SkinID="TableCellSkin" ColumnSpan="2">
                            <asp:Table ID="tblUserDetails" runat="server" Width="100%">
                                <asp:TableRow Width="100%">
                                      <asp:TableCell SkinID="TableCellSkin">
                                        <asp:Label ID="lblUserNo" runat="server" SkinID="GeneralLabelSkin" Text="User No:"></asp:Label>
                                    </asp:TableCell>
                                    <asp:TableCell SkinID="TableCellSkin">
                                        <asp:Label ID="lblGreeting" runat="server" SkinID="GeneralLabelSkin" Text="Greeting:"></asp:Label>
                                    </asp:TableCell>
                                    <asp:TableCell SkinID="TableCellSkin">
                                        <asp:Label ID="lblFrstname" runat="server" SkinID="GeneralLabelSkin" Text="First Name:"></asp:Label>
                                    </asp:TableCell>
                                    <asp:TableCell SkinID="TableCellSkin">
                                        <asp:Label ID="lblLstName" runat="server" SkinID="GeneralLabelSkin" Text="Last Name:"></asp:Label>
                                    </asp:TableCell>
                                    <asp:TableCell SkinID="TableCellSkin">
                                        <asp:Label ID="lablSSN" runat="server" SkinID="GeneralLabelSkin" Text="SSN:"></asp:Label>
                                    </asp:TableCell>
 
                               </asp:TableRow>
                                  <asp:TableRow Width="100%">
                                      <asp:TableCell SkinID="TableCellSkin">
                                         <asp:TextBox ID="txtUserNo" SkinID="GenTextBoxBorderSkin" runat="server"></asp:TextBox>
                                       
                                    </asp:TableCell>
                                    <asp:TableCell SkinID="TableCellSkin">
                                        <asp:TextBox ID="txtGreeting" SkinID="GenTextBoxBorderSkin" runat="server"></asp:TextBox>
                                    </asp:TableCell>
                                    <asp:TableCell SkinID="TableCellSkin">
                                       <asp:TextBox ID="txtFrstname" SkinID="GenTextBoxBorderSkin" runat="server"></asp:TextBox>
                                   
                                    </asp:TableCell>
                                    <asp:TableCell SkinID="TableCellSkin">
                                        <asp:TextBox ID="txtLstName" SkinID="GenTextBoxBorderSkin" runat="server"></asp:TextBox>
                                       
                                    </asp:TableCell>
                                    <asp:TableCell SkinID="TableCellSkin">
                                           <asp:TextBox ID="txtSSN" SkinID="GenTextBoxBorderSkin" runat="server"></asp:TextBox>
                                       
                               </asp:TableRow>
                        </asp:Table>
                        </asp:TableCell>
                    </asp:TableRow>
                </asp:Table>
                        </asp:TableCell>
                    </asp:TableRow>
                </asp:Table>
 
</asp:Content>
 

Open in new window


<asp:Table SkinID="OuterTableSkin" runat="server" BorderColor="Navy" BorderStyle="Solid" BorderWidth="2px" Width="80%" />
<asp:TableHeaderRow SkinID="TableHeaderRowSkin" runat="server" Font-Names="Verdana,Courier New,Arial,Helvetica,sans-serif" Font-Bold="true" VerticalAlign="Top" Font-Size="12px" HorizontalAlign="Left" BorderColor="Navy" BorderStyle="Solid" BorderWidth="1px" />          
<asp:TableHeaderCell SkinID="TableHeaderCellSkin" runat="server" Font-Names="Verdana,Courier New,Arial,Helvetica,sans-serif" Font-Bold="true" Font-Size="12px" VerticalAlign="Top" BorderColor="Navy" BorderStyle="Solid" BorderWidth="1px" BackColor="Navy" ForeColor="White" Align="Center"/>
<asp:TableRow SkinID="GeneralRowSkin" runat="server" Font-Names="Verdana,Courier New,Arial,Helvetica,sans-serif" Font-Bold="true" VerticalAlign="Top" Font-Size="12px" HorizontalAlign="Left" ForeColor="Navy" />
<asp:TableCell SkinID="TableCellSkin" runat="server" Font-Names="Verdana,Courier New,Arial,Helvetica,sans-serif" Font-Bold="false" VerticalAlign="Top" HorizontalAlign="Left" Font-Size="12px" ForeColor="#DEE5FB"  CssClass="NoWrap"/>
.NoWrap
{
    white-space:nowrap;
}

Thanks
0
KavyaVS
Asked:
KavyaVS
  • 4
  • 2
1 Solution
 
Ess KayEntrapenuerCommented:
0
 
KavyaVSAuthor Commented:
It's  not about padding or border. Please see the source code I given.
we are putting the controls(Text Box and Labels) in  80% outer Table width. How that width
distributed for the controls.

Please see the .aspx code given and if you get any idea please let me know.

thanks
0
 
Ess KayEntrapenuerCommented:
<asp:Table SkinID="OuterTableSkin" runat="server" BorderColor="Navy" BorderStyle="Solid" BorderWidth="2px" Width="80%" />


the above  line would take the parent component, and make the table inside it 80% of that parent width.

Does that answer your question or would you like to rephrase?
0
Independent Software Vendors: We Want Your Opinion

We value your feedback.

Take our survey and automatically be enter to win anyone of the following:
Yeti Cooler, Amazon eGift Card, and Movie eGift Card!

 
KavyaVSAuthor Commented:
Did the columnspan used in the source  playing any role or not? If so how it is effecting the table cells width.

   
 <asp:TableRow SkinID="GeneralRowSkin" Width="100%">
                        <asp:TableCell SkinID="TableCellSkin" ColumnSpan="2">
                            <asp:Table ID="tblUserDetails" runat="server" Width="100%">

Open in new window


Thanks
0
 
KavyaVSAuthor Commented:
I've requested that this question be closed as follows:

Accepted answer: 0 points for KavyaVS's comment #a39725614

for the following reason:

Thanks
0
 
KavyaVSAuthor Commented:
Thanks
0

Featured Post

[Webinar] Cloud and Mobile-First Strategy

Maybe you’ve fully adopted the cloud since the beginning. Or maybe you started with on-prem resources but are pursuing a “cloud and mobile first” strategy. Getting to that end state has its challenges. Discover how to build out a 100% cloud and mobile IT strategy in this webinar.

  • 4
  • 2
Tackle projects and never again get stuck behind a technical roadblock.
Join Now