so i have a label and a textbox in my web page and they wont stay inside the table. here is the code:
<table position: absolute; bottom:0px; border="2" style="width: 100%">
<asp:Label ID="Label1" runat="server" Text="Total de Marcações com os critérios indicados:"></asp:Label><asp:TextBox ID="txtTotalLinhas" runat="server" ReadOnly="True"></asp:TextBox>
</table>
the table just stays under the label and text box does anyone knows why?
here is a print (that line under the label and textbox is the table)
worth noticing this is all inside a div here is the div code
<div style=" float:left; width:50%; border-right:1px solid gray; border-left:1px solid gray; ">
change your code to below
<table position: absolute; bottom:0px; border="2" style="width: 100%">
<tr>
<td>
<asp:Label ID="Label1" runat="server" Text="Total de Marcações com os critérios indicados:"></asp:Label>
</td>
<td><asp:TextBox ID="txtTotalLinhas" runat="server" ReadOnly="True"></asp:TextBox>
</td>
</tr>
</table>
Try this
Related
I have got a listview which is styled with css but dosent work.Am I missing something here.
<asp:ListView ID="msg_list" runat="server">
<ItemTemplate>
<tr class="myitem">
<td> <asp:Label role="menuitem" ID="msg_lbl" runat="server" text='<%#Eval("msg")%>' /> </td>
</tr>
<%--<hr style=" margin-top:1px; margin-bottom:1px; " />--%>
</ItemTemplate>
</asp:ListView>
Here is the css
.myitem
{
background-color:Red;
}
Table rows (tr) can't be styled as other elements (e.g. table cells (td)), meaning they don't react on every kind of styling. Why don't you just write:
Fiddle
<asp:ListView ID="msg_list" runat="server">
<ItemTemplate>
<table>
<tr class="myitem">
<td>
<asp:Label role="menuitem" ID="msg_lbl" runat="server" text='<%#Eval("msg")%>' />
</td>
</tr>
</table>
<%--<hr style=" margin-top:1px; margin-bottom:1px; " />--%></ItemTemplate>
</asp:ListView>
tr.myitem td{
width:200px;
height:20px;
border:2px solid;
background:red;
}
OR
Fiddle
<asp:ListView ID="msg_list" runat="server">
<ItemTemplate>
<table>
<tr class="myitem">
<td>
<asp:Label role="menuitem" ID="msg_lbl" runat="server" text='<%#Eval("msg")%>' />
</td>
</tr>
</table>
<%--<hr style=" margin-top:1px; margin-bottom:1px; " />--%></ItemTemplate>
.myitem {
background:red;
}
EDIT
You need to add <table> tag
I have a custom control, which has a Button + image, if image(down arrow) is clicked, a DIV should display, just like Dropdownlist.
However, its pushing the page contents to down to display the DIV. How to fix this.
It should just behave like dropdown
List should display on top of Button instead button
<table id="container" border="0" cellpadding="0" cellspacing="0">
<tr>
<td>
<asp:Button ID="btnPost" runat="server" CssClass="postButton" OnClick="btnPost_Click" />
<asp:Button ID="btnDropDown" runat="server" CssClass="dropdownButton" OnClick="btnDropDown_Click" />
</td>
</tr>
<tr>
<td>
<div runat="server" id="divDropDownPanel" visible="false" style="text-align: left;
overflow: scroll; float: left; border: thin solid lightgrey; width: 160px; height: 120px;
background-color: #FFFFFF; position: absolute; z-index: 999;">
<asp:Repeater ID="rptDropDownContent" runat="server" OnItemDataBound="rptDropDownContent_ItemDataBound">
<HeaderTemplate>
<table>
</HeaderTemplate>
<ItemTemplate>
<tr>
<td align="left">
<asp:CheckBox ID="chkChannel" runat="server" />
</td>
</tr>
</ItemTemplate>
<FooterTemplate>
</tr> </table>
</FooterTemplate>
</asp:Repeater>
<br />
</div>
</td>
</tr>
Here what I've done and whats my problem. First of all i got a big table with a lot of td the first td on top of my table containt anoter table and (here come my problem) theres a space under that little table and I don't know why.
Here's the code for my table:
<div runat="server" class="ReportPage" >
<table runat="server" class="ListReportBigTable" align="center">
<tr>
<td class="style13" colspan="3" >
<table width="46%" align="center"style="height:50%; "cellpadding="0">
<tr>
<td align="left">
<asp:Label ID="LB_ChooseReport" runat="server"
Text="Choisissez un dossier médical: " Font-Size="Small">
</asp:Label>
</td>
</tr>
<tr>
<td style="vertical-align:bottom" align="left">
<asp:UpdatePanel ID="UpdatePanel3" runat="server">
<ContentTemplate>
<div id="div_Filter" runat="server" visible="false" align="left">
<asp:Label ID="LBL_FilteredBy" runat="server" width="18%" Text="Patient : "
Font-Size="Small" style="margin-left: 0px"></asp:Label>
<asp:DropDownList ID="DDL_FilterSelect" runat="server" AutoPostBack="true"
Width="25%" CssClass="DDL_Filter" Font-Size="Small" Height="18px"></asp:DropDownList>
</div>
</ContentTemplate>
</asp:UpdatePanel></td></tr></table>
<br />
</td>
and here the CSS:
.ListReportBigTable
{
height:25%;
width:55%;
text-align:center;
vertical-align:middle;
border: thick solid black;
margin-left: 0px;
}
thx in advance
I don't know if it's a typo but you are closing with a </td> after your closing </table> tag. In addition you have a <br /> before the closing misplaced </td> which would obviously add space to the bottom.
Try changing the closing </td> to </table></div> and removing the <br />
In addition, in your CSS try adding margin-bottom: 0px; and padding-bottom: 0px; to see if this has an effect.
Also, what is after the table? Maybe whatever is being displayed after the table has it's own top margin/padding?
Do you have a link to the actual page where this is occuring so we can examine with Firebug or similar and try to figure it out?
I have an ASP.NET control. I want to align the textbox to the right and the label to the left.
I have this code so far:
<td colspan="2">
<asp:Label ID="Label6" runat="server" Text="Label"></asp:Label>
<div style="text-align: right">
<asp:TextBox ID="TextBox3" runat="server"></asp:TextBox>
</div>
</td>
The textbox aligns to the right, but the label aligns to the left and on the line above. How can I fix this so that the label is on the left, the textbox on the right, and both on the same line?
Thanks
you can use style
<td colspan="2">
<div style="float:left; width:80px"><asp:Label ID="Label6" runat="server" Text="Label"></asp:Label></div>
<div style="float: right; width:100px">
<asp:TextBox ID="TextBox3" runat="server"></asp:TextBox>
</div>
<div style="clear:both"></div>
</td>
You should use CSS to align the textbox. The reason your code above does not work is because by default a div's width is the same as the container it's in, therefore in your example it is pushed below.
The following would work.
<td colspan="2" class="cell">
<asp:Label ID="Label6" runat="server" Text="Label"></asp:Label>
<asp:TextBox ID="TextBox3" runat="server" CssClass="righttextbox"></asp:TextBox>
</td>
In your CSS file:
.cell
{
text-align:left;
}
.righttextbox
{
float:right;
}
You can do it with a table, like this:
<table width="100%">
<tr>
<td style="width: 50%">Left Text</td>
<td style="width: 50%; text-align: right;">Right Text</td>
</tr>
</table>
Or, you can do it with CSS like this:
<div style="float: left;">
Left text
</div>
<div style="float: right;">
Right text
</div>
I have a problem with my modalpopup style when I use frame in my page. I don't get trouble with modalpopup style if I don't use frames in page. Following HTML code and CSS work in normal aspx without a problem. In a page with frame, panel gets top of the page and background colour (grey colour) covers just half of page. And link button goes to right of page. Why does this happen?
CSS style:
/* dialog frame */
.modal-dialog
{
position:absolute;
}
/* dialog contents container */
.modal-dialog .container
{
font-family:tahoma,helvetica,arial,sans-serif;
font-size:11px;
width:340px;
border:solid 1px #99aabd;
background-color:#F2F9FF;
}
/* dialog header */
.modal-dialog .header
{
background:url(img/sprite.gif) repeat-x 0px -1100px;
height:25px;
padding-top:5px;
}
/* dialog header message */
.modal-dialog .header .msg
{
vertical-align:middle;
padding-left:6px;
color:#fff;
font-size:12px;
font-weight:bold;
}
/* dialog body */
.modal-dialog .body
{
height:40px;
background-color:#F2F9FF;
}
/* dialog body message */
.modal-dialog .body h2
{
padding-top:10px;
background-color: #F2F9FF;
font-size:14px;
text-align:center;
font-weight:normal;
}
/* dialog footer */
.modal-dialog .footer
{
height:30px;
background-color: #F2F9FF;
}
/* dialog footer buttons */
.modal-dialog .footer .right
{
background-color: #F2F9FF;
float:none;
text-align:center;
padding-bottom:6px;
}
/* dialog footer checkbox */
.modal-dialog .footer .left
{
background-color: #F2F9FF;
float:left;
text-align:left;
padding-bottom:6px;
padding-left:6px;
}
/* dialog close */
.modal-dialog .close
{
right:4px;
background: url(img/icons.gif) no-repeat -732px 0px;
width:16px;
cursor:hand;
position:absolute;
top:5px;
height:16px;
}
/* dialog close hover */
.modal-dialog .close:hover { background: url(img/icons.gif) no-repeat -749px 0px; }
/* modal overlay */
.modalBackground
{
background-color:Gray;
filter:alpha(opacity=50);
opacity:0.5;
}
Page's code. It works properly when I don't use frame:
<body>
<form id="form1" runat="server">
<asp:ScriptManager ID="ScriptManager1" runat="server" />
<div>
<TABLE id="Table1" style="Z-INDEX: 101; POSITION: absolute; WIDTH: 685px; HEIGHT: 192px; TOP: 45px; LEFT: 8px"
cellSpacing="1" cellPadding="1" width="685" border="0">
<TR>
<TD noWrap>
<TABLE id="Table2" cellSpacing="0" cellPadding="2" width="100%" border="0">
<TR>
<TD style="WIDTH: 129px; HEIGHT: 6px" noWrap><asp:label id="Label3" runat="server">Personel Tipi</asp:label></TD>
<TD style="HEIGHT: 6px" noWrap><asp:dropdownlist id="cboID_PERSONAL_TYPE" runat="server" Width="200px" AutoPostBack="True"></asp:dropdownlist></TD>
</TR>
<TR>
<TD style="WIDTH: 129px" noWrap><asp:label id="Label1" runat="server" Width="112px"> Personel Name</asp:label></TD>
<TD noWrap><asp:textbox id="txtDS_NAME" runat="server" Width="200px" BorderColor="LightSteelBlue" BorderWidth="1px" Height="20px" BorderStyle="Solid"></asp:textbox></TD>
</TR>
<TR>
<TD style="WIDTH: 129px" noWrap></TD>
<TD noWrap>
<asp:checkbox id="chkActive" runat="server" Text="Active"></asp:checkbox></TD>
</TR>
<TR>
<TD style="WIDTH: 129px" noWrap><asp:label id="Label4" runat="server" Width="112px">Temsilci No</asp:label></TD>
<TD noWrap><asp:textbox id="txtTEMSILCI_NO" runat="server" Width="80px" BorderColor="LightSteelBlue" BorderWidth="1px"
Height="20px" BorderStyle="Solid" MaxLength="10"></asp:textbox></TD>
</TR>
<TR>
<TD style="WIDTH: 129px" noWrap><asp:label id="Label2" runat="server" Width="112px">Director (TSM)</asp:label></TD>
<TD noWrap><asp:dropdownlist id="cboID_DIRECTOR" runat="server" Width="200px"></asp:dropdownlist></TD>
</TR>
<TR>
<TD style="WIDTH: 129px" noWrap>
<asp:label id="Label5" runat="server" Width="136px">Expert. (TC)</asp:label></TD>
<TD noWrap>
<asp:dropdownlist id="cboID_EXPERT" runat="server" Width="200px"></asp:dropdownlist></TD>
</TR>
<TR>
<TD style="WIDTH: 129px; HEIGHT: 14px" noWrap>
<asp:label id="Label31" runat="server" Width="88px">Type</asp:label></TD>
<TD noWrap style="HEIGHT: 14px">
<asp:dropdownlist id="cboID_Type" runat="server"></asp:dropdownlist></TD>
</TR>
<TR>
<TD style="WIDTH: 129px" noWrap>
<asp:label id="Label6" runat="server" Width="88px">Rut</asp:label></TD>
<TD noWrap>
<asp:dropdownlist id="cbo_ID_RT" runat="server"></asp:dropdownlist></TD>
</TR>
</TABLE>
</TD>
</TR>
<TR>
<TD noWrap align="right" style="HEIGHT: 21px"><asp:button id="btnSave" runat="server" Width="65px" Text="Save" CssClass="MY_BUTTON"></asp:button>
<asp:button id="btnCancel" runat="server" Width="65px" Text="Delete" CssClass="MY_BUTTON"></asp:button> <asp:button id="btnDelete" runat="server" Width="65px" Text="Sil" CssClass="MY_BUTTON"></asp:button></TD>
</TR>
<TR>
<TD noWrap align="right" height="20"><asp:label id="lblStatus" runat="server" Height="16px" ForeColor="Red" Font-Bold="True"></asp:label></TD>
</TR>
<TR>
<TD noWrap>
</TD>
</TR>
</TABLE>
<asp:label id="Label29" style="Z-INDEX: 103; POSITION: absolute; TOP: 8px; LEFT: 8px" runat="server"
Width="168px" Height="8px" ForeColor="#0000C0" Font-Bold="True" Font-Size="12pt">Parametreler > Bayi ></asp:label><asp:label id="Label30" style="Z-INDEX: 102; POSITION: absolute; TOP: 8px; LEFT: 184px" runat="server"
Width="200px" Height="8px" ForeColor="#C00000" Font-Bold="True" Font-Size="12pt">Personel / Temsilci Girişi</asp:label><asp:textbox id="hdnID" style="Z-INDEX: 104; POSITION: absolute; TOP: 8px; LEFT: 472px" runat="server"
Width="33px" BorderColor="LightSteelBlue" BorderWidth="1px" BorderStyle="Solid" Visible="False"></asp:textbox>
<cc1:modalpopupextender ID="mdlDelete" runat="server"
PopupControlID="pnlDelete" BackgroundCssClass="modalBackground" OkControlID="btnDeleteOk" CancelControlID="btnDeleteCancel"
TargetControlID="btnDelete">
</cc1:modalpopupextender>
<asp:Panel ID="pnlDelete" runat="server" CssClass="modal-dialog" style="display:none">
<div class="frame">
<div class="container">
<div class="header">
<div class="msg">Warning</div>
<asp:LinkButton ID="LinkButton1" runat="server" CssClass="close" OnClientClick="$find('mdlDelete').hide(); return false;" />
</div>
<div class="body">
<h2>Are u sure?h2>
</div>
<div class="footer">
<div class="right">
<asp:Button
ID="btnDeleteOk" runat="server" Text="Yes" Width="40px" />
<input id="btnDeleteCancel" type="button" value="No" style="width:40px" />
</div>
</div>
</div>
</div>
</asp:Panel>
</div>
</form>
</body>
Background color: I assume, that only the Frame will be grey. This is OK, since you should not change HTML Code in another Frame.
Position: The Modal Extender calculates the dialog position. So your CSS values are ignored. Use the Property X and Y on the modalpopupextender to set a fixed position.
<cc1:modalpopupextender ID="mdlDelete" runat="server"
PopupControlID="pnlDelete" BackgroundCssClass="modalBackground"
OkControlID="btnDeleteOk" CancelControlID="btnDeleteCancel"
TargetControlID="btnDelete" X="10" Y="10" />
OK,i solved my problem.I am migrating my project from 2003 to 2008.I copied my page to 2008,not created new page.So when i create new page in 2008,page runs without problem.