none
posição objetos na tela RRS feed

 > 

  • Pergunta

  • Question
    Entrar para Votar
    0
    Entrar para Votar

    Bom dia.

    Estou com o seguinte problema.

    Estou construindo um objeto que no Visual Studio tem a aparência que eu desejo. Mas ao carregar no browser ele fica diferente, alguém saberia me dizer o porque e o que devo fazer para que a aparência fique correta.

    O código é o seguinte:

    <%@ Page Language="C#" AutoEventWireup="true" CodeBehind="WebForm1.aspx.cs" Inherits="WebApplication1.WebForm1" %>

<!DOCTYPE html>

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title></title>
</head>
<body>
    <form id="form1" runat="server">
    
    <div>
        <asp:Table ID="Table1" runat="server" BorderStyle="None" style="border-bottom-width:0; border-left:0; border-top:0; margin-top:0; margin-left:0; padding-left:0; padding-top:0">
            <asp:TableRow runat="server" style="border-bottom-width:0; border-left:0; border-top:0; margin-top:0; margin-left:0; padding-left:0; padding-top:0">
                <asp:TableCell runat="server" BorderStyle="None" style="border-bottom-width:0; border-left:0; border-top:0; margin-top:0; margin-left:0; padding-left:0; padding-top:0; width:22px">
                    <asp:TextBox ID="TextBox1" runat="server" ></asp:TextBox>
                </asp:TableCell>
                <asp:TableCell runat="server" style="border-bottom-width:0; border-left:0; border-top:0; margin-top:0; margin-left:0; padding-left:0; padding-top:0">
                    <asp:Table ID="Table2" runat="server" style="border-bottom-width:0; border-left:0; border-top:0; margin-top:0; margin-left:0; padding-left:0; padding-top:0">
                        <asp:TableRow ID="TableRow1" runat="server" style="border-bottom-width:0; border-left:0; border-top:0; margin-top:0; margin-left:0; padding-left:0; padding-top:0">
                            <asp:TableCell ID="TableCell2" runat="server" style="border-bottom-width:0; border-left:0; border-top:0; margin-top:0; margin-left:0; padding-left:0; padding-top:0">
                                <asp:ImageButton ID="btnUp" runat="server" style="margin-top:0; margin-left:0; padding-left:0; padding-top:0; width:8px" ImageUrl="~/Imagens/Up.png" />
                            </asp:TableCell>
                        </asp:TableRow>
                        <asp:TableRow ID="TableRow2" runat="server" style="border-bottom-width:0; border-left:0; border-top:0; margin-top:0; margin-left:0; padding-left:0; padding-top:0" >
                            <asp:TableCell ID="TableCell1" runat="server" style="border-bottom-width:0; border-left:0; border-top:0; margin-top:0; margin-left:0; padding-left:0; padding-top:0" >
                                <asp:ImageButton ID="btnDown" runat="server" style="margin-top:0; margin-left:0; padding-left:0; padding-top:0; width:8px" ImageUrl="~/Imagens/Down.png" />
                            </asp:TableCell>
                        </asp:TableRow>
                    </asp:Table>
                </asp:TableCell>
            </asp:TableRow>
        </asp:Table>
    </div>
    </form>
</body>
</html>

    A aparência no Visual Studio que é a que desejo é:

    E a aparência que é mostrada no browser é:

    Notem que a distância estre as setas aumentou.

    Alguém sabe o porque, alguém teria a solução para que no browser fique igual a do Visual Studio.

    Grato,

    domingo, 13 de outubro de 2013 20:23
    |

Respostas

  • Question
    Entrar para Votar
    1
    Entrar para Votar

    Então o objeto na verdade são tags HTML então use CSS para posicionar e tirar os espaços a mais!

    tudo em HTML é configurado via CSS e suporte Javascript

    Fúlvio Cezar Canducci Dias

    segunda-feira, 14 de outubro de 2013 00:52
    |
  • Question
    Entrar para Votar
    0
    Entrar para Votar

    Nkasso, 

    Boa noite. 

    Não é uma boa prática trabalharmos com tabela. O ideal é que sejam utilizados DIV. Além do mais, CSS pode te ajudar a deixar o site com um visual melhor. Quanto ao problema relatado no seu código, notei que você criou uma tabela dentro da outra, e nesta nova tabela você não definiu o CellPadding e CellSpacing. Defina os dois como 0, exemplo:

    <asp:Table ID="Table2" runat="server" BorderStyle="None" CellPadding="0" CellSpacing="0">

    Isso irá melhorar a visualização, no entanto, só consegui resolver o problema por completo com a utilização de DIVs.


    Abraço

    • Sugerido como Resposta Raphael de Abreu segunda-feira, 14 de outubro de 2013 03:04
    • Marcado como Resposta Giovani Cr sexta-feira, 18 de outubro de 2013 15:19
    segunda-feira, 14 de outubro de 2013 03:01
    |

Todas as Respostas

  • Question
    Entrar para Votar
    1
    Entrar para Votar

    Então o objeto na verdade são tags HTML então use CSS para posicionar e tirar os espaços a mais!

    tudo em HTML é configurado via CSS e suporte Javascript

    Fúlvio Cezar Canducci Dias

    segunda-feira, 14 de outubro de 2013 00:52
    |
  • Question
    Entrar para Votar
    0
    Entrar para Votar

    Nkasso, 

    Boa noite. 

    Não é uma boa prática trabalharmos com tabela. O ideal é que sejam utilizados DIV. Além do mais, CSS pode te ajudar a deixar o site com um visual melhor. Quanto ao problema relatado no seu código, notei que você criou uma tabela dentro da outra, e nesta nova tabela você não definiu o CellPadding e CellSpacing. Defina os dois como 0, exemplo:

    <asp:Table ID="Table2" runat="server" BorderStyle="None" CellPadding="0" CellSpacing="0">

    Isso irá melhorar a visualização, no entanto, só consegui resolver o problema por completo com a utilização de DIVs.


    Abraço

    • Sugerido como Resposta Raphael de Abreu segunda-feira, 14 de outubro de 2013 03:04
    • Marcado como Resposta Giovani Cr sexta-feira, 18 de outubro de 2013 15:19
    segunda-feira, 14 de outubro de 2013 03:01
    |