Html Alignment in .aspx page - html

Hi I am not good in Html alignment. Can you please help me. I want make some space between two button (add, cancel button).(Please see the image) I tried ti fix it but no luck. Please help me. see the image link(http://i.stack.imgur.com/7M9sE.jpg)
<table style="background-color: #F5F5E9" cellspacing="2">
<tr>
<td align="left" style="width: 70px;">
Note Type
</td>
<td align="left" style="width: 82px; height: 24px;">
<telerik:RadComboBox ID="RadComboBox1" EmptyMessage="Please select" runat="server"
MarkFirstMatch="True" CollapseDelay="0" Width="115px" DropDownWidth="100px" AllowCustomText="True">
<CollapseAnimation Duration="0" />
</telerik:RadComboBox>
<asp:RequiredFieldValidator InitialValue="" ValidationGroup="Notes" ID="RequiredFieldValidator1"
runat="server" ControlToValidate="ddlNoteType" ClientValidationFunction="ddlNt"
Display="None" ErrorMessage="Please select Note Type."></asp:RequiredFieldValidator>
<cc2:ValidatorCalloutExtender ID="ValidatorCalloutExtender1" TargetControlID="custValCou"
runat="server" Enabled="True">
</cc2:ValidatorCalloutExtender>
</td>
<td>
</td>
</tr>
<tr>
<td align="left" valign="middle" style="width: 70px;">
Notes
</td>
<td align="left">
<asp:TextBox ID="TextBox1" runat="server" TextMode="MultiLine" Rows="3" Width="570px"></asp:TextBox>
<asp:RequiredFieldValidator ID="RequiredFieldValidator2" ValidationGroup="Notes"
ControlToValidate="txtNoteDesc" Display="None" runat="server" ErrorMessage="Please enter Notes."></asp:RequiredFieldValidator>
<cc2:ValidatorCalloutExtender ID="ValidatorCalloutExtender2" TargetControlID="valCliID"
runat="server">
</cc2:ValidatorCalloutExtender>
</td>
<td>
<span style="padding-bottom: 4px;">
<asp:Button ID="Button1" Width="60px" OnClick="btnAddNote_Click" ValidationGroup="Notes"
runat="server" Text="Add" /></span>
<asp:Button ID="Button2" Width="60px" runat="server" OnClientClick="return hideAddNotes()"
Text="Cancel" />
</td>
</tr>

instead of:
<span style="padding-bottom: 4px;">
use:
<div style="padding-bottom: 4px;">

You could also add a break tag in between your buttons:
<asp:Button ID="Button1" Width="60px" OnClick="btnAddNote_Click"
ValidationGroup="Notes" runat="server" Text="Add" /></span>
<br />
<asp:Button ID="Button2" Width="60px" runat="server"
OnClientClick="return hideAddNotes()" Text="Cancel" />

Related

On Textbox change event how to show loading animation on Gridview data processing?

I have a Asp.Net webpage where I have a textbox with calendar extender, when the user enters the date the loading animation should load while the grid data is processing.I have the below code (Jquery, HTML) which works only when the user enters the date using extender but not when the user keys in. None of my solutions working after applying Ajax UpdateProgress aswell. ANY suggestions would help.
$(document).ready(function () {
$("[id$='ddlCountry'], [id$='DateTxtBox']").change(function () {
$('.blockMe').block({
message: 'Loading...',
css: { padding: '10px' }
});
});
});
<table style="width:100%">
<tr>
<td>
<div style="padding-top: 10px; padding-right: 60px; padding-bottom: 5px; width: 100%; overflow: hidden" class="table-responsive">
<table style="margin-left: 30px; margin-top:20px; width:100%;">
<tr>
<td style="padding-left:5%; padding-top:10px; padding-bottom:10px;">
<asp:Label ID="DateFromlbl" class="text-muted" Style="font-size: 13px; text-align: right; font-weight: 600" Text="Date From (MM/dd/yyyy):" runat="server"></asp:Label>
<asp:TextBox ID="DateTxtBox" Style="font-size: 10px; font-weight: 600" Width="80px" Height="20px" AutoPostBack="true" OnTextChanged="DateTxtBox_OnTextChanged" runat="server" />
<asp:Image ID="CalendarImg" runat="server" Width="18px" Height="18px" ImageUrl="~/DailyDownloads/Images/Calendar.PNG" />
<cc1:CalendarExtender ID="DateFromCalenderExt" runat="server" TargetControlID="DateTxtBox" PopupButtonID="CalendarImg"></cc1:CalendarExtender>
<asp:RequiredFieldValidator runat="server" ForeColor="Red" id="reqName" controltovalidate="DateTxtBox" errormessage="Date Required"/>
<asp:RegularExpressionValidator ValidationExpression="^([0-9]|0[1-9]|1[012])\/([0-9]|0[1-9]|[12][0-9]|3[01])\/(19|20)\d\d$" ID="dateValidator"
ControlToValidate="DateTxtBox" ForeColor="Red" ErrorMessage="Invalid Date Format. Use MM/DD/YYYY" runat="server"></asp:RegularExpressionValidator>
</td>
</tr>
<tr><td>
<table style="width:100%;">
<asp:UpdatePanel ID="UpdatePanel1" runat="server" UpdateMode="Conditional">
<ContentTemplate>
<asp:Panel ID ="p1" runat="server">
<td>
<asp:Label ID="Countrylbl" Style="font-size: 13px; text-align: right; font-weight: 600" class="text-muted" Text="Agencies:" runat="server"></asp:Label>
<asp:DropDownList ID="ddlCountry" Style="width: 200px;" class="btn btn-primary btn-sm dropdown-toggle" type="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false" Width="50%" runat="server" AutoPostBack="true" OnSelectedIndexChanged="ddlMunicipality_OnSelectedIndexChanged" AppendDataBoundItems="true">
<asp:ListItem Text="All" Value="ALL"></asp:ListItem>
</asp:DropDownList>
</td>
</asp:Panel>
</ContentTemplate>
<Triggers>
<asp:AsyncPostBackTrigger ControlID="DateTxtBox" EventName="TextChanged" />
</Triggers>
</asp:UpdatePanel>
</tr></table>
</td>
</tr>
<tr>
<td colspan="4">
<asp:UpdatePanel ID="UpdatePanel2" runat="server" UpdateMode="Conditional">
<ContentTemplate>
<div class="blockMe">
<asp:GridView EnableEventValidation="false" ID="EmpGrd" ShowHeaderWhenEmpty="true" runat="server" AutoGenerateColumns="false" AllowPaging="true"
AllowSorting="true" PageSize="25" Width="100%" OnPageIndexChanging="EmpGrd_PageIndexChanging" OnSorting="EmpGrd_Sorting" FooterStyle-BackColor="Black" CssClass="table table-condensed table-hover">
<Columns>
<asp:TemplateField ItemStyle-HorizontalAlign="Center" ItemStyle-Width="5%">
<asp:BoundField DataField="EmpID" HeaderText="EmpID" ItemStyle-Width="10%" ItemStyle-Wrap="false" ReadOnly="True" SortExpression="MtgRef" />
<asp:BoundField DataField="Name" HeaderText="Name" ItemStyle-Width="25%" ItemStyle-Wrap="false" SortExpression="Name" />
<asp:BoundField DataField="Employment" HeaderText="Employment" ItemStyle-Width="10%" ItemStyle-Wrap="false" SortExpression="TaxAgency" />
<asp:BoundField DataField="JoinedDate" HeaderText="JoinedDate" ItemStyle-Width="14%" ItemStyle-Wrap="false" SortExpression="CurrentAdvancedDate" />
<asp:BoundField DataField="DateofBirth" HeaderText="DateofBirth" ItemStyle-Width="14%" ItemStyle-Wrap="false" SortExpression="NewAdvancedDate" />
<asp:BoundField DataField="JobDescription" HeaderText="JobDescription" ItemStyle-Width="30%" ItemStyle-Wrap="true" Visible="true" SortExpression="LegalDescription" />
</Columns>
<EmptyDataTemplate><label class="label label-danger" style="font-size:13px; font-weight:600;">No records found !</label></EmptyDataTemplate>
<PagerStyle HorizontalAlign="Left" CssClass="GridPager" />
</asp:GridView>
</div>
</ContentTemplate>
<Triggers>
<asp:AsyncPostBackTrigger ControlID="ddlcountry" EventName="SelectedIndexChanged"/>
<asp:AsyncPostBackTrigger ControlID="DateTxtBox" EventName ="TextChanged"/>
</Triggers>
</asp:UpdatePanel>
</td>
</tr>
</table>
</div>
</td>
</tr>
</table>

Allingment issue in html - need to get the record in right corner

I have added a new row .
for defaultGPnamer i need to bring that to the right end.
Please help on this .
attached the code
<LayoutTemplate>
<asp:PlaceHolder ID="itemPlaceholder" runat="server"></asp:PlaceHolder>
</LayoutTemplate>
<ItemTemplate>
<div class="rounded" style="margin-left:10px">
<table style="width: 560px; height:95px;">
<tr>
<td colspan="3" style="height:22px">
<div>
<span style="font-size:11pt; color:#008FBE; font-weight:bold; line-height: 22px"><%#Eval("MMHMember")%><%#Eval("UserName") %></span>
<i><b><%#Eval("gender")%> <%#Eval("Age","{0} Yrs</b>") %></b></i>
<span><%#Eval("DateOfBirth")%>
</span>
</div>
</td>
<td style="text-align:right">
<span style="color:#008FBE; font-size:11pt; line-height: 22px;"><%#Eval("NHINumber")%></span>
</td>
</tr>
<tr>
<td>
<asp:Label ID="lbldefaultgp" runat="server" style="font-weight:bold;color:#008FBE;"><%#Eval("DefaultGPName")%></asp:Label>
</td>
</tr>
<tr style="text-align:left; vertical-align:top">
<td style="width:100px;">
<asp:Image ID="imgPatientPhoto" runat="server" ImageUrl='<%#GetPhotoURL(Eval("PhotoURL","{0}"))%>' style="width:90px;height:95px" />
</td>
<td style="width: 125px">
<br />
<asp:Label ID="lblHome" runat="server" style="font-weight:bold"><%#Eval("HomePhone")%></asp:Label>
<br />
<asp:Label ID="lblWork" runat="server" style="font-weight:bold"><%#Eval("WorkPhone")%></asp:Label>
<br />
<asp:Label ID="lblMobail" runat="server" style="font-weight:bold"><%#Eval("Mobilenumber")%></asp:Label>
</td>
<td style="width:140px;">
<asp:Label ID="lblAddress" runat="server" style="font-weight:bold"><%#Eval("Address") %></asp:Label>
</td>
<td style="" >
<asp:Label runat ="server" ID ="lblEnrolledPractice"><%#Eval("businessname") %> </asp:Label> <br />
<asp:Label runat ="server" ID ="lblCasualPractice"><%#Eval("CasualBusinessname") %> </asp:Label>
<p>
<asp:LinkButton ID="lnkViewConsentSetting" runat="server" CommandArgument="<%# Container.DataItemIndex %>" CommandName="ConsentSetting" Visible="<%# ApplyCareSetting %>" >View Consent Settings</asp:LinkButton>
</p>
<p>
<asp:LinkButton ID="lnkViewHealthSummary" runat="server" CommandArgument="<%# Container.DataItemIndex %>" CommandName="HealthSummary" Visible ='<%# SetHESVisible("SEHR") %>'>View Health Summary</asp:LinkButton>
<asp:LinkButton ID="lnkViewHealthSummaryConsent" runat="server" Visible ='<%# SetHESVisible("CONSENT") %>' Text="View Health Summary"></asp:LinkButton>
</p>
</td>
</tr>
</table>
</div>
</ItemTemplate>
I would be greatful if someone can help on this.
Label id is lbldefaultgp.
need to bring that data to right end in the banner.
notes::::
<LayoutTemplate>
<asp:PlaceHolder ID="itemPlaceholder" runat="server"></asp:PlaceHolder>
</LayoutTemplate>
<ItemTemplate>
<div class="rounded" style="margin-left:10px">
<table style="width: 560px; height:95px;">
<tr>
<td colspan="3" style="height:22px">
<div>
<span style="font-size:11pt; color:#008FBE; font-weight:bold; line-height: 22px"><%#Eval("MMHMember")%><%#Eval("UserName") %></span>
<i><b><%#Eval("gender")%> <%#Eval("Age","{0} Yrs</b>") %></b></i>
<span><%#Eval("DateOfBirth")%>
</span>
</div>
</td>
<td style="text-align:right">
<span style="color:#008FBE; font-size:11pt; line-height: 22px;"><%#Eval("NHINumber")%></span>
</td>
</tr>
<tr>
<td colspan="3" style="height:22px">
<div>
</div>
</td>
<td>
<p>is this the thing you want?</p> <asp:Label ID="lbldefaultgp" runat="server" style="font-weight:bold;color:#008FBE;"><%#Eval("DefaultGPName")%></asp:Label>
</td>
</tr>
<tr style="text-align:left; vertical-align:top">
<td style="width:100px;">
<asp:Image ID="imgPatientPhoto" runat="server" ImageUrl='<%#GetPhotoURL(Eval("PhotoURL","{0}"))%>' style="width:90px;height:95px" />
</td>
<td style="width: 125px">
<br />
<asp:Label ID="lblHome" runat="server" style="font-weight:bold"><%#Eval("HomePhone")%></asp:Label>
<br />
<asp:Label ID="lblWork" runat="server" style="font-weight:bold"><%#Eval("WorkPhone")%></asp:Label>
<br />
<asp:Label ID="lblMobail" runat="server" style="font-weight:bold"><%#Eval("Mobilenumber")%></asp:Label>
</td>
<td style="width:140px;">
<asp:Label ID="lblAddress" runat="server" style="font-weight:bold"><%#Eval("Address") %></asp:Label>
</td>
<td style="" >
<asp:Label runat ="server" ID ="lblEnrolledPractice"><%#Eval("businessname") %> </asp:Label> <br />
<asp:Label runat ="server" ID ="lblCasualPractice"><%#Eval("CasualBusinessname") %> </asp:Label>
<p>
<asp:LinkButton ID="lnkViewConsentSetting" runat="server" CommandArgument="<%# Container.DataItemIndex %>" CommandName="ConsentSetting" Visible="<%# ApplyCareSetting %>" >View Consent Settings</asp:LinkButton>
</p>
<p>
<asp:LinkButton ID="lnkViewHealthSummary" runat="server" CommandArgument="<%# Container.DataItemIndex %>" CommandName="HealthSummary" Visible ='<%# SetHESVisible("SEHR") %>'>View Health Summary</asp:LinkButton>
<asp:LinkButton ID="lnkViewHealthSummaryConsent" runat="server" Visible ='<%# SetHESVisible("CONSENT") %>' Text="View Health Summary"></asp:LinkButton>
</p>
</td>
</tr>
</table>
</div>
</ItemTemplate>

Regular expressing error message is not displaying .net

My reqular expression is not working but error is not popping
Here is my brief code - It looks simple, I could not able figure out the error in my code.
<TR id="ROW2" runat="server" visible="false">
<TD class="main" align=left>
<asp:Label id="Lab3" runat="server" Text="Cheque No: "></asp:Label>
</TD>
<TD vAlign=top align=left>
<asp:TextBox id="TxtChequeno" runat="server" MaxLength="20" cssclass="textbox"></asp:TextBox>
<asp:RegularExpressionValidator style="VERTICAL-ALIGN: top" id="REVMobile" runat="server"
ControlToValidate="TxtChequeno"
ErrorMessage="Please enter valid Cheque number"
ValidationExpression="^(?=.*\d).{10}$"
ValidationGroup="tripSheet">*</asp:RegularExpressionValidator>
</TD>
</TR>
<TR id="ROW3" runat="server" visible="false">
<TD class="main" align=left>
<asp:Label id="Lab4" runat="server" Text="Cheque Date: "></asp:Label>
</TD>
<TD vAlign=top align=left>
<asp:TextBox id="txtFromDate" runat="server" CssClass="textbox" MaxLength="11" Width="128px"></asp:TextBox>
<asp:Image style="CURSOR: pointer" id="ImaArr1" runat="server" ImageUrl="./images/CAL.GIF"></asp:Image>
<cc1:CalendarExtender id="CalendarExtender2" runat="server" CssClass="yui" TargetControlID="TxtCardDte" PopupButtonID="ImaArr1" Format="dd-MMM-yyyy"></cc1:CalendarExtender>
<asp:RequiredFieldValidator id="RFtxtFromDate" runat="server" ControlToValidate="txtFromDate" ErrorMessage="Select Arrival date" SetFocusOnError="True" ValidationGroup="tripSheet">*</asp:RequiredFieldValidator>
<asp:CustomValidator ID="CustxtFromDate" runat="server" ClientValidationFunction="CallDateFunForToDate1" ControlToValidate="txtFromDate" ValidationGroup="tripSheet" errormessage="Invalid Cheque Date." style="vertical-align:top;">*</asp:CustomValidator>
</td>
</TD>
</TR>
<TR id="RowBtn" runat="server" visible="false">
<td>
<asp:Button ID="BtnAdd" runat="server" Text="Add" CssClass="button" ValidationGroup="tripSheet" />
</td>
</TR>

The whole page gets refresh while using Captcha refresh

I have used the captcha refresh button to refresh the captcha code, but the scenario is that when I click on the refresh image, the whole form gets refreshed. Please help. Also see the code below:-
<table style="width: 583px;">
<tr>
<td>Name</td>
<td>
<asp:TextBox ID="TextBox1" runat="server" class="txtfld-popup"></asp:TextBox>
<asp:RequiredFieldValidator ID="RequiredFieldValidator1" runat="server" ErrorMessage="Please enter your Full Name" ControlToValidate="Fullname" Display="Dynamic" Style="font-size: 13px;"></asp:RequiredFieldValidator>
<cc1:TextBoxWatermarkExtender ID="TextBoxWatermarkExtender4" runat="server" TargetControlID="FullName" WatermarkText="Enter Your Full Name"></cc1:TextBoxWatermarkExtender>
</td>
</tr>
<tr>
<td>Contact No.</td>
<td>
<asp:TextBox ID="TextBox2" class="txtfld-popup" runat="server" MaxLength="10" onkeypress="if(event.keyCode<48 || event.keyCode>57)event.returnValue=false;"></asp:TextBox>
<asp:RequiredFieldValidator ID="RequiredFieldValidator2" runat="server" ErrorMessage="Please enter Contact No." Display="Dynamic" ControlToValidate="ContactNo" ValidationExpression="\w+([-+.']\w+)*#\w+([-.]\w+)*\.\w+([-.]\w+)*" Style="font-size: 13px;"></asp:RequiredFieldValidator>
<asp:RegularExpressionValidator ID="RegularExpressionValidator1" runat="server" ErrorMessage="Please enter valid Contact No." Display="Dynamic" ControlToValidate="ContactNo" ValidationExpression="^\d{10}$" Style="font-size: 13px;"></asp:RegularExpressionValidator>
<cc1:TextBoxWatermarkExtender ID="TextBoxWatermarkExtender5" runat="server" TargetControlID="ContactNo" WatermarkText="Enter Your Contact No."></cc1:TextBoxWatermarkExtender>
</td>
</tr>
<tr>
<td>Purpose </td>
<td>
<asp:TextBox ID="TextBox3" runat="server" class="txtfld-popup" ValidationGroup="VG"></asp:TextBox>
<cc1:TextBoxWatermarkExtender ID="TextBoxWatermarkExtender6" runat="server" TargetControlID="Purpose" WatermarkText="Enter Your Purpose"></cc1:TextBoxWatermarkExtender>
</td>
</tr>
<tr>
<td> </td>
<td>
<div>
<cc1:CaptchaControl ID="CaptchaControl1" runat="server" CaptchaBackgroundNoise="Low" CaptchaLength="5"
CaptchaHeight="60" CaptchaWidth="200" CaptchaMinTimeout="5" CaptchaMaxTimeout="240"
FontColor="#D20B0C" NoiseColor="#B1B1B1" Width="150" />
</div>
<asp:ImageButton ID="ImageButton2" ImageUrl="~/images/refresh.png" runat="server" CausesValidation="false" />
<br />
<asp:TextBox ID="TextBox4" runat="server" MaxLength="5"></asp:TextBox>
<asp:CustomValidator ID="CustomValidator2" ErrorMessage="Invalid. Please try again." OnServerValidate="ValidateCaptcha"
runat="server" />
<p style="margin-top: 3px; margin-bottom: 3px;">
<asp:Label ID="Label1" runat="server"></asp:Label>
</p>
</td>
</tr>
<tr>
<td> </td>
<td>
<asp:Button ID="Button1" runat="server" Text="Submit" OnClick="btnSend_Click" class="button-form" Width="100" />
<asp:Button ID="Button2" runat="server" Text="Reset" OnClick="btnReset_Click" class="button-form" Width="100" CausesValidation="false" /></td>
</tr>
Also see the code behind for your reference:-
protected void ValidateCaptcha(object sender, ServerValidateEventArgs e)
{
Captcha1.ValidateCaptcha(txtCaptcha.Text.Trim());
e.IsValid = Captcha1.UserValidated;
if (e.IsValid)
{
ClientScript.RegisterClientScriptBlock(this.GetType(), "ResponseDialog", "$(document).ready(function(){ResponseDialog();});", true);
SendMail();
}
}
Please help
Finally added a update panel for the solution:-
<tr>
<td> </td>
<td>
<div>
<asp:UpdatePanel ID="updatePanel" UpdateMode="Conditional" runat="server">
<ContentTemplate>
<table>
<tr>
<td>
<cc1:CaptchaControl ID="Captcha1" runat="server" CaptchaBackgroundNoise="Low" CaptchaLength="5"
CaptchaHeight="60" CaptchaWidth="200" CaptchaMinTimeout="5" CaptchaMaxTimeout="240"
FontColor="#D20B0C" NoiseColor="#B1B1B1" />
</td>
<td>
<asp:ImageButton ID="ImgRefreshButton" ImageUrl="~/images/refresh.png" runat="server" CausesValidation="false" />
</td>
</tr>
</table>
</ContentTemplate>
<Triggers>
<asp:AsyncPostBackTrigger ControlID="ImgRefreshButton" EventName="Click" />
</Triggers>
</asp:UpdatePanel>
<asp:TextBox ID="txtCaptcha" runat="server" MaxLength="5"></asp:TextBox>
<asp:CustomValidator ID="CustomValidator1" ErrorMessage="Invalid. Please try again." OnServerValidate="ValidateCaptcha"
runat="server" />
<p style="margin-top: 3px; margin-bottom: 3px;">
<asp:Label ID="lblLeaveNo2" runat="server"></asp:Label>
</p>
</td>
</tr>
And it is working for me. :)

Prevent table from wrapping

How do I prevent a table from wrapping when it is inside of an outer table cell?
Have a look at the simplified example at the bottom of my question.
My aspx-tablerow:
<tr runat="server" id="trButtons">
<td align="left" colspan="9" valign="top" style="white-space:nowrap"><br />
<asp:Button ID="btnImeiLookup" OnClick="btnImeiLookupClick" runat="server" ValidationGroup="VG_RMA_LOOKUP" CausesValidation="true" Text="lookup IMEI" ToolTip="lookup IMEI and check if RMA-Number can be generated" Width="120px" />
<asp:Button ID="BtnEdit" CommandName="Edit" CommandArgument='<%# Eval("idRMA")%>' ValidationGroup="VG_RMA_SAVE" runat="server" CausesValidation="false" Text="Edit" ToolTip="edit" Width="120px" />
<asp:Button ID="BtnAdd" runat="server" CommandName="Add" CausesValidation="false" Text="Add new" Width="130px" ToolTip="add new" />
<asp:Button ID="BtnDelete" runat="server" CommandName="Delete" CommandArgument='<%# Eval("idRMA")%>' CausesValidation="true" Text="Delete" Width="120px" ToolTip="delete" OnClientClick="return confirm('do you really want to delete this RMA?')" />
<uc4:RmaPrinterView ID="RmaPrinterView1" Visible="true" runat="server" />
</td>
</tr>
RmaPrinterView1 is an ASP.Net Usercontrol:
<table cellpadding="0" cellspacing="0">
<tr>
<td>
<input type="button" style="width:120px; white-space:nowrap" onclick="javascript:$('#TblPrinterView').jqprint();" value="Print" title="Print" />
</td>
</tr>
<tr>
<td>
<table id="TblPrinterView" style="display:none">
<tr>
<td style="width:100px;white-space:nowrap">
<asp:Label ID="LblRmaNumberDesc" runat="server" Text="RMA-Number:"></asp:Label>
</td>
<td>
<asp:Label ID="LblRmaNumber" runat="server" Text="xxxxxxxxxxxxxx"></asp:Label>
</td>
</tr>
<tr>
<td>
<asp:Label ID="LblImeiDesc" runat="server" Text="IMEI:"></asp:Label>
</td>
<td>
<asp:Label ID="LblImei" runat="server" Text="xxxxxxxxxxxxxx"></asp:Label>
</td>
</tr>
<tr>
<td>
<asp:Label ID="LblModelDesc" runat="server" Text="Model:"></asp:Label>
</td>
<td>
<asp:Label ID="LblModel" runat="server" Text="xxxxxxxxxxxxxx"></asp:Label>
</td>
</tr>
<tr>
<td>
<asp:Label ID="LblSiDpyDesc" runat="server" Text="SI/DPY:"></asp:Label>
</td>
<td>
<asp:Label ID="LblSiDpy" runat="server" Text="xxxxxxxxxxxxxx"></asp:Label>
</td>
</tr>
<tr>
<td>
<asp:Label ID="LblSymptomCodesDesc" runat="server" Text="Symptoms:"></asp:Label>
</td>
<td>
<asp:Label ID="LblSymptomCodes" runat="server" Text="xxxxxxxxxxxxxx"></asp:Label>
</td>
</tr>
</table>
</td>
</tr>
</table>
As you can see, the Usercontrol with the inner table is wrapped:
I know that I should avoid table layout, but I needed a fast working solution ;-)
EDIT: a simplified sample that is also wrapping:
<table>
<tr>
<td style="white-space:nowrap">
<input type="button" value="b1" />
<input type="button" value="b2" />
<input type="button" value="b3" />
<table>
<tr>
<td style="white-space:nowrap"><input type="button" value="in table" /></td>
</tr>
</table>
</td>
</tr>
</table>
UPDATE:
The solution - as Jeroen mentioned - was to make the table an inline element with style="display: inline". The next problem was that I used an ASP.Net UpdatePanel inside the UserControl which is normally rendered as a Div. So the next block-element that causes my table to wrap. I only needed to set the UpdatePanel's RenderMode to Inline what causes it to be rendered as Span.
If the css white-space does not work, you can try to add nowrap="nowrap" to your td, just like you added valign="top".
Very ugly, but it should work.
Edit: Ah, now I see: A table is a block-level element so it will always go to a new line unless you make it an inline-element or float it.
table tr td {
white-space: nowrap;
}
You've put the table at odds with itself. It is set to finite pixel count and yet you don't want to wrap once that's exceeded. You might attempt:
white-space: nowrap;
overflow: hidden;