I can not align a label inside a td

4

In a calendar, I need to put a label next to it. It turns out the label is getting below it. If I open another one the label is on the far right, and I need it right next to it.

Here's a table:

<tr>
    <td style="text-align:right">Data Exclusão:</td>
    <td> <cc1:Calendario id="calDataExclusao" runat="server" AutoPostBack="true" OnTextChanged="calDataExclusao_TextChanged" />
    <label for="calDataExclusao" id="lblPrazoSubsAns" style="color: red"></label>
    <asp:HiddenField ID="hidQtdeDiasExclusao" runat="server" />
    <asp:HiddenField ID="hidIndLEI13003" runat="server" />
    </td>
  </tr>

The label #lblPrazoSubsAns should be next to the calendar and is below the image (the label is in red). should be next to calendar date exclusion:

Thisisthejsfunctionthatwritestothelabel:

functionmontaDataSubstituicaoPrestador(dt_exclusao){varprazoSubPrestador=60;vararrData=dt_exclusao.split('/');varexclusaoFormatada=arrData[1]+'-'+arrData[0]+'-'+arrData[2];vardias=parseInt(prazoSubPrestador);varnovaData=newDate(arrData[2],arrData[1]-1,arrData[0]);novaData.setDate(novaData.getDate()+dias);hoje=newDate(novaData)dia=hoje.getDate()mes=hoje.getMonth()ano=hoje.getFullYear()if(dia<10)dia="0" + dia

            if ((mes + 1) < 10)
                mes = "0" + (mes + 1);

            if (ano < 2000)
                ano = "19" + ano

            var dt = dia + "/" + (mes) + "/" + ano;

            document.getElementById('lblPrazoSubsAns').innerHTML = "Prazo de substituição: " + dt;

Inspecting the element, I found this:

<img id="cphSisamil_ctl09" title="Selecionar data" 
onmouseover="this.style.background='red'" 
onmouseout="this.style.background=''" 
src="/WebResource.axd?d=Ul-3xiPb1B4J0WWLRIfpYACSRxlLXH3ITbNxp7Css3e_oMUxdaIVbbuJR6SblAROTBzgpsmR0Qp77syLZ7ErNWN0KNRq2W0aApS95jg8W9TWJs49S5547dtEyUZBzBIFqVmIP9vRGWQcAvwdBZi4qacmPWLlwkepIxwXLLDJaD7tRqIeinn1kdWvZsstnmfL0&amp;t=635845770857885677" 
style="border: 1px solid red; cursor: pointer;" "="">

Taking the suggestion of RBoschini, it almost worked. It looks like this:

Youhavebrokenthelayout,asshownabove.

Hereismyfullhtml,asIsaid:

<%@PageTitle="" Language="C#" MasterPageFile="~/Sisamil.Master" AutoEventWireup="true" CodeBehind="prs0101.aspx.cs" Inherits="Amil.Sisamil.UI.Web.Modulos.Odonto.Forms.odo_prs.prs0101" %>
<%@ Register Assembly="AjaxControlToolkit" Namespace="AjaxControlToolkit" TagPrefix="asp" %>
<%@ Register assembly="Amil.Sisamil.UI.WebControls" namespace="Amil.Sisamil.UI.WebControls" tagprefix="cc1" %>
<%@ Register src="~/Modulos/Odonto/Forms/gen_odo/buscaPrestador.ascx" tagname="buscaPrestador" tagprefix="uc1" %>
<%@ Register Src="~/Modulos/Odonto/Forms/gen_odo/listaOperadoras.ascx" TagName="listaOperadora" TagPrefix="uc2" %>
<asp:Content ID="Content2" ContentPlaceHolderID="cphSisamil" runat="server">
    <asp:UpdatePanel ID="upPrincipal" runat="server" UpdateMode="Conditional">
        <ContentTemplate>
            <uc1:buscaPrestador ID="buscaPrestador1" runat="server" OnSelecionaPrestador="buscaPrestador1_OnSelecionaPrestador" DescricaoLableComponente=""/>
            <table id="tblOperadora" runat="server" visible="false" cellpadding="0" cellspacing="0" width="100%" border="0">
                <tr>
                    <td width="15%" style="text-align:right">Operadora:</td>
                    <td width="85%">
                        <table cellpadding="0" cellspacing="0">
                            <tr>
                                <td><uc2:listaOperadora ID="listaOperadora1" runat="server" AutoPostBack="true" Visible="false" ExibirDescricao="false" OnSelecionaOperadora="listaOperadora1_OnSelecionaOperadora"/></td>
                                <td style="padding-left:5px"><asp:LinkButton ID="linkIndicado" runat="server" Text="Prestador indicado como substituto" ForeColor="Red" Visible="false" OnClick="linkIndicado_OnClick"></asp:LinkButton></td>
                            </tr>
                        </table>
                    </td>
                </tr>
            </table>
            <div id="dvDados" runat="server" visible="false">
                <table width="100%">
                    <tr>
                        <td style="width:30%; text-align:right">Motivo:</td>
                        <td style="width:70%"><asp:DropDownList ID="ddlMotivoExclusao" runat="server" Width="400px" OnSelectedIndexChanged="ddlMotivoExclusao_OnSelectedIndexChanged" AutoPostBack="true"></asp:DropDownList></td>
                    </tr>
                    <tr id="trDataNotificacaoExclusaoVoluntaria" runat="server" visible="false">
                        <td style="text-align:right">Data Notificação da Exclusão Voluntária:<span style="color:Red">*</span></td>
                        <td><cc1:Calendario id="calDataNotificacaoExclusaoVoluntaria" runat="server" AutoPostBack="false" /></td>
                    </tr>
                    <tr style="white-space:nowrap;width:auto;word-break:break-all;">
                        <td style="text-align:right">Data Exclusão:</td>
                        <td align="left">
                            <%--<cc1:Calendario id="calDataExclusao" runat="server" AutoPostBack="true" OnTextChanged="calDataExclusao_TextChanged" />
                            <label for="calDataExclusao" id="lblPrazoSubsAns" style="color: red">--%>
                            <ul style="float: left;">
                                <li style="display:inline-table;"><cc1:Calendario id="calDataExclusao" runat="server" AutoPostBack="true" OnTextChanged="calDataExclusao_TextChanged" /></li>
                                <li style="display:inline-table;"><label for="calDataExclusao" id="lblPrazoSubsAns" style="color: red"></label></li>
                            </ul>
                            <asp:HiddenField ID="hidQtdeDiasExclusao" runat="server" />
                            <asp:HiddenField ID="hidIndLEI13003" runat="server" />
                        </td>
                    </tr>
                    <tr>
                        <td style="text-align:right">Data Limite Realização:</td>
                        <td><cc1:Calendario id="calDataLimiteRealizacao" runat="server" AutoPostBack="false" /></td>
                    </tr>
                    <tr>
                        <td style="text-align:right">Data Limite Apresentação:</td>
                        <td><cc1:Calendario id="calDataLimiteApresentacao" runat="server" AutoPostBack="false" /></td>
                    </tr>
                    <tr>
                        <td style="text-align:right">Data Limite Reapresentação:</td>
                        <td><cc1:Calendario id="calDataLimiteReapresentacao" runat="server" AutoPostBack="false" /></td>
                    </tr>
                    <tr>
                        <td valign="top" style="text-align:right">Observação:</td>
                        <td><asp:TextBox ID="txtObservacao" runat="server" width="400px" TextMode="MultiLine" Height="60px"/></td>
                    </tr>
                    <tr>
                        <td style="text-align:right">Emite Carta de Descredenciamento:</td>
                        <td><asp:CheckBox ID="ckbDescredenciamento" runat="server" /></td>
                    </tr>
                </table>
                <br />
                <asp:CheckBox ID="chkRedesDataFim" runat="server" Text="Redes com Data Fim" AutoPostBack="true" Visible="false" OnCheckedChanged="chkRedesDataFim_OnCheckedChanged" />
                <br />
                <fieldset id="fdsPrestadorRede" runat="server" style="padding:10px 10px 10px 10px">
                    <legend style="padding-bottom:8px"> Redes </legend>
                    <asp:UpdatePanel ID="upGrid" runat="server" UpdateMode="Conditional">
                        <ContentTemplate>
                                <asp:HiddenField ID="hidQtdeRede" runat="server" />
                                <asp:GridView ID="gridRedePrestador" runat="server" AutoGenerateColumns="False" BackColor="White" BorderColor="LightGray" BorderStyle="Solid" BorderWidth="1px" CellPadding="4" Width="100%">
                                    <Columns>
                                        <asp:TemplateField ItemStyle-Height="8%" HeaderStyle-CssClass="gridHeaderStyle" HeaderText="Trocar Substituto" ItemStyle-HorizontalAlign="Center">
                                            <ItemTemplate>
                                                <asp:CheckBox ID="chkTrocarSubstituto" runat="server" ToolTip="Trocar Substituto" Enabled="false" AutoPostBack="true" OnCheckedChanged="chkTrocarSubstituto_OnCheckedChanged" />
                                            </ItemTemplate>
                                        </asp:TemplateField>
                                        <asp:TemplateField ItemStyle-Height="10%" ItemStyle-HorizontalAlign="Center">
                                            <ItemTemplate>
                                                <asp:CheckBox ID="chkSelecaoRede" runat="server" ToolTip="Selecionar Rede" />
                                            </ItemTemplate>
                                        </asp:TemplateField>
                                        <asp:TemplateField HeaderStyle-CssClass="gridHeaderStyle" HeaderText="Rede" ItemStyle-HorizontalAlign="Left" ItemStyle-Width="25%">
                                            <ItemTemplate>
                                                <asp:Label ID="lblRedePrestador" runat="server" Text='<%# Eval("Rede") %>'></asp:Label>
                                                <asp:HiddenField ID="hidCodigoRede" runat="server" Value='<%# Eval("cod_rede") %>' />
                                                <asp:HiddenField ID="hidDataExclusao" runat="server" Value='<%# Eval("dt_exclusao") %>' />
                                                <asp:HiddenField ID="hidCodPrestadorSub" runat="server" Value='<%# Eval("cod_prestador_sub") %>' />
                                            </ItemTemplate>
                                        </asp:TemplateField>
                                        <asp:TemplateField HeaderStyle-CssClass="gridHeaderStyle" HeaderText="Prestador Substituto" ItemStyle-Width="25%">
                                            <ItemTemplate>
                                                <table>
                                                    <tr>
                                                        <td><uc1:buscaPrestador ID="buscaPrestadorGrid" runat="server" Width="240px" ExibirBotaoLimpar="false" ExibirOpcaoAdicionar="false" OnBuscaPrestador="buscaPrestadorGrid_OnSelecionaPrestador" DescricaoLableComponente="null"/></td>
                                                        <td><asp:ImageButton ID="btDetalhesExclusao" runat="server" ImageUrl="~/Imagens/folha.gif" BorderStyle="None" ToolTip="Detalhe das informações do registro exclusão" OnClick="btDetalhesExclusao_OnClick" Visible="false" /></td>
                                                    </tr>
                                                </table>
                                            </ItemTemplate>
                                        </asp:TemplateField>
                                        <asp:TemplateField HeaderStyle-CssClass="gridHeaderStyle" HeaderText="Mesma Região" ItemStyle-Width="14%" ItemStyle-HorizontalAlign="Center">
                                            <ItemTemplate>
                                                <asp:Label ID="lblMesmaRegiao" runat="server" ForeColor="Green"></asp:Label>
                                            </ItemTemplate>
                                        </asp:TemplateField>
                                        <asp:TemplateField HeaderStyle-CssClass="gridHeaderStyle" ItemStyle-Width="18%" ItemStyle-HorizontalAlign="Center">
                                            <HeaderTemplate>
                                                <table width="100%">
                                                    <tr>
                                                        <td class="gridHeaderStyle">Status</td>
                                                        <td><asp:ImageButton ID="btValidar" runat="server" ImageUrl="~/Imagens/validar.png" OnClick="btValidar_OnClick" /></td>
                                                    </tr>
                                                </table>
                                            </HeaderTemplate>
                                            <ItemTemplate>
                                                <asp:Label ID="lblStatus" runat="server" ForeColor="Green"></asp:Label>
                                            </ItemTemplate>
                                        </asp:TemplateField>
                                    </Columns>
                                    <EditRowStyle CssClass="gridEditRowStyle" />
                                    <HeaderStyle CssClass="gridHeaderStyle" />
                                    <RowStyle CssClass="gridRowStyle" />
                                    <SelectedRowStyle BackColor="#D9F3FF" />
                                    <AlternatingRowStyle CssClass="gridAlternatingRowStyle" />
                                </asp:GridView>
                        </ContentTemplate>
                    </asp:UpdatePanel>
                </fieldset>
            </div>
            <asp:ModalPopupExtender ID="mpeSubstitutoDe" runat="server" CancelControlID="btnFecharSubstitutoDe" TargetControlID="lkbSubstitutoDe" PopupControlID="panelSubstitutoDe" BackgroundCssClass="modalBackground"></asp:ModalPopupExtender>
            <asp:Panel ID="panelSubstitutoDe" runat="server" Style="display: none" CssClass="modalPopup" Width="650px">
                <asp:LinkButton ID="lkbSubstitutoDe" TabIndex="999" runat="server"></asp:LinkButton>
                <div style="border: 3px solid #1D5283">
                    <table width="100%" cellpadding="0" cellspacing="0">
                        <tr>
                            <td id="tdTitulo" runat="server" style="background-image: url('../../Imagens/titlebg_dark.gif'); height: 25px; color: White">
                                <table id="tbTitulo" runat="server">
                                    <tr>
                                        <td style="width: 640px; color: White" align="left"><b>Erros Encontrados</b></td>
                                        <td style="cursor: default">
                                            <asp:ImageButton ID="btnFecharSubstitutoDe" runat="server" BorderStyle="None" ImageUrl="~/Imagens/fechar0.png" ToolTip="Fechar"></asp:ImageButton>
                                        </td>
                                    </tr>
                                </table>
                            </td>
                        </tr>
                        <tr>
                            <td id="tdToolbar" runat="server" style="height: 40px; background-image: url('../../Imagens/titlebg.gif')">
                                <asp:ImageButton ID="btnVoltarSubstitutoDe" ImageUrl="~/Imagens/seta_esq2_b.gif" Width="23px" runat="server" ToolTip="Voltar" />
                            </td>
                        </tr>
                        <tr>
                            <td style="padding:10px 10px 10px 10px">
                                <br />
                                <span style="color:Red; text-decoration:underline; font-weight:bold">Prestador substituto de:</span>
                                <br />
                                <br />
                                <div id="dvBusca" runat="server" style="overflow-x:hidden; overflow-y:auto; height:200px">
                                    <asp:GridView ID="gridSubstitutoDe" runat="server" AutoGenerateColumns="False" Width="100%" BorderColor="#CCCCCC" BorderStyle="Solid" BorderWidth="1px" CellPadding="3">
                                        <Columns>
                                            <asp:BoundField ItemStyle-Width="12%" DataField="cod_prestador" HeaderText="Código" HeaderStyle-CssClass="gridHeaderStyle" />
                                            <asp:BoundField ItemStyle-Width="38%" DataField="nome_prestador" HeaderText="Nome" HeaderStyle-CssClass="gridHeaderStyle" />
                                            <asp:BoundField ItemStyle-Width="32%" DataField="rede" HeaderText="Rede" HeaderStyle-CssClass="gridHeaderStyle" />
                                            <asp:BoundField ItemStyle-Width="18%" DataField="dt_fim_exibe_direcionamento" ItemStyle-HorizontalAlign="Center" HeaderStyle-CssClass="gridHeaderStyle" HeaderText="Disponível para visualização até" />
                                        </Columns>
                                        <FooterStyle CssClass="gridFooterStyle" />
                                        <HeaderStyle CssClass="gridHeaderStyle" />
                                        <RowStyle CssClass="gridRowStyle" />
                                        <AlternatingRowStyle CssClass="gridAlternatingRowStyle" />
                                    </asp:GridView>
                                    <br />
                                </div>
                            </td>
                        </tr>
                    </table>
                </div>
            </asp:Panel>
            <asp:ModalPopupExtender ID="mpeDetalhesExclusao" runat="server" TargetControlID="linkDetalhesExclusao" PopupControlID="panelDetalhesExclusao" BackgroundCssClass="modalBackground"></asp:ModalPopupExtender>
            <asp:Panel ID="panelDetalhesExclusao" runat="server" Style="display: none" CssClass="modalPopup" Width="520px">
                <asp:LinkButton ID="linkDetalhesExclusao" TabIndex="999" runat="server"></asp:LinkButton>
                <div style="border: 3px solid #1D5283">
                    <table width="100%" cellpadding="0" cellspacing="0">
                        <tr>
                            <td id="tdExclusaoTitulo" runat="server" style="background-image: url('../../Imagens/titlebg_dark.gif'); height: 25px; color: White">
                                <table id="Table1" runat="server">
                                    <tr>
                                        <td style="width: 640px; color: White" align="left"><b>Detalhe das informações do registro exclusão</b></td>
                                        <td style="cursor: default">
                                            <asp:ImageButton ID="btExclusaoFechar" runat="server" BorderStyle="None" ImageUrl="~/Imagens/fechar0.png" ToolTip="Fechar"></asp:ImageButton>
                                        </td>
                                    </tr>
                                </table>
                            </td>
                        </tr>
                        <tr>
                            <td style="padding:15px 15px 20px 5px">
                                <table>
                                    <tr>
                                        <td align="right">Operadora:</td>
                                        <td style="padding-left:0px"><uc2:listaOperadora ID="listaOperadoraExclusao" runat="server" Width="233px" ExibirDescricao="false" AutoPostBack="true" Visible="true"/></td>
                                    </tr>
                                    <tr>
                                        <td align="right">Motivo:</td>
                                        <td><asp:TextBox ID="txtExclusaoMotivo" Width="230px" runat="server" ReadOnly="true" Enabled="false"></asp:TextBox></td>
                                    </tr>
                                    <tr>
                                        <td align="right">Data Notificação da Exclusão Voluntária:</td>
                                        <td><asp:TextBox ID="txtExclusaoDataNotificacaoVoluntaria" Width="90px" runat="server" ReadOnly="true" Enabled="false"></asp:TextBox></td>
                                    </tr>
                                    <tr>
                                        <td align="right">Data Exclusão:</td>
                                        <td><asp:TextBox ID="txtExclusaoDataExclusao" Width="90px" runat="server" ReadOnly="true" Enabled="false"></asp:TextBox>
                                            <%--<asp:Label ID="lblPrazoSubsAns" runat="server"></asp:Label>--%>
                                        </td>

                                    </tr>
                                    <tr>
                                        <td align="right">Data Limite Realização:</td>
                                        <td><asp:TextBox ID="txtExclusaoDataLimiteRealizacao" Width="90px" runat="server" ReadOnly="true" Enabled="false"></asp:TextBox></td>
                                    </tr>
                                    <tr>
                                        <td align="right">Data Limite Apresentação:</td>
                                        <td><asp:TextBox ID="txtExclusaoDataLimiteApresentacao" Width="90px" runat="server" ReadOnly="true" Enabled="false"></asp:TextBox></td>
                                    </tr>
                                    <tr>
                                        <td align="right">Data Limite Reapresentação:</td>
                                        <td><asp:TextBox ID="txtExclusaoDataLimiteReapresentacao" Width="90px" runat="server" ReadOnly="true" Enabled="false"></asp:TextBox></td>
                                    </tr>
                                    <tr>
                                        <td align="right" valign="top">Observações:</td>
                                        <td><asp:TextBox ID="txtExclusaoObservacoes" Width="230px" Height="50px" runat="server" ReadOnly="true" Enabled="false" TextMode="MultiLine"></asp:TextBox></td>
                                    </tr>
                                </table>
                            </td>
                        </tr>
                    </table>
                </div>
            </asp:Panel>
        </ContentTemplate>
    </asp:UpdatePanel>

    <script type="text/javascript">
        function montaDataSubstituicaoPrestador(dt_exclusao) {

            var prazoSubPrestador = 60;

            var arrData = dt_exclusao.split('/');

            var exclusaoFormatada = arrData[1] + '-' + arrData[0] + '-' + arrData[2];
            var dias = parseInt(prazoSubPrestador);
            var novaData = new Date(arrData[2], arrData[1] - 1, arrData[0]);

            novaData.setDate(novaData.getDate() + dias);

            hoje = new Date(novaData)
            dia = hoje.getDate()
            mes = hoje.getMonth()
            ano = hoje.getFullYear()
            if (dia < 10)
                dia = "0" + dia

            if ((mes + 1) < 10)
                mes = "0" + (mes + 1);

            if (ano < 2000)
                ano = "19" + ano

            var dt = dia + "/" + (mes) + "/" + ano;

            document.getElementById('lblPrazoSubsAns').innerHTML = "Prazo de substituição: " + dt;
        }
    </script>

</asp:Content>

At the suggestion of colleague RBoschini, I put a border and see how it is. I tried to line up on the left, but I could not. see image below.

    
asked by anonymous 08.12.2015 / 18:18

2 answers

0

Try to put the elements you want online into one ul after the display: inline in the li in.

<tr>
    <td style="text-align:right">Data Exclusão:</td>
    <td align="left"> 
        <ul style="float: left;">
            <li style="display:inline-table;"><cc1:Calendario id="calDataExclusao" runat="server" AutoPostBack="true" OnTextChanged="calDataExclusao_TextChanged" /></li>
            <li style="display:inline-table;"><label for="calDataExclusao" id="lblPrazoSubsAns" style="color: red"></label></li>
        </ul>
        <asp:HiddenField ID="hidQtdeDiasExclusao" runat="server" />
        <asp:HiddenField ID="hidIndLEI13003" runat="server" />
    </td>
  </tr>

Try this, this is the way. If you use bootstrap, try to put the list-inline class on your ul.

    
09.12.2015 / 12:20
0

Try to put the parameter Style within the tag of the calendar with float:left!important value. It will take label to the right of the calendar. This should resolve.

    
13.01.2017 / 20:33