Как уменьшить страницу ASPX - PullRequest
1 голос
/ 15 апреля 2010

Я занимаюсь разработкой веб-приложения на C # / ASP.NET в VS 2008. В настоящее время эта страница слишком высокая. Кнопки появляются сверху, а затем между этими кнопками и текстом resultLabel появляется большой разрыв. Следующий код взят из моего файла ASPX. Я попытался перейти на вкладку «Дизайн» этого файла и вручную переместить эту метку, но все еще остается большой пробел. Я уверен, что это просто. Как мне исправить это?

<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="DataMatch.aspx.cs" Inherits="AddFileToSQL.DataMatch" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml" >
<head runat="server">
    <title></title>
    <style type="text/css">
    </style>
    <script language="javascript" type="text/javascript">
    </script>
</head>
<body>
    <form id="Form1" method="post" runat="server">
    <table width="50%" >
        <tr>
        </tr>
        <tr align="center">
            <td align="center" valign="top">
                <asp:placeholder runat="server" id="phTextBoxes"></asp:placeholder>
            </td>
             <td colspan="2">
                <asp:Label ID="Instructions" runat="server" Font-Italic="True"  
                    Text="Now select from the dropdownlists which table columns from my database you want to map these fields to"></asp:Label>
            </td>
            <td align="center" colspan="2" >
                <asp:button id="btnSubmit" runat="server" text="Submit" width="150px" style="top:auto; left:auto"
                    OnClick="btnSubmit_Click" top="100px"></asp:button>
                &nbsp;
                </td>
       </tr>
     <asp:panel id="pnlDisplayData" runat="server" visible="False">
        <tr>
            <td colspan="2" align="center" valign="top">
                <asp:literal id="lTextData" runat="server"></asp:literal>
            </td>
        </tr></asp:panel>
    </table> 

    <table align="center"><tr>
    <td style="text-align: center;width: 300px;">
    <asp:Label ID="resultLabel" runat="server" style="position:absolute; text-align:center;" 
        Visible="False"></asp:Label>
    </td></tr></table>    
    <p>
</p>      
    </form>
    </body>
</html>

Ответы [ 5 ]

0 голосов
/ 15 апреля 2010

Есть много вещей, которые отчасти неправильны:

  1. Вы указали colspan, который не требуется, так как у вас нет 5 TD в любом TR
  2. ВнутриТаблица, которую вы дали Asp Panel.Эта панель должна находиться внутри td, на котором размещен этот буквальный элемент управления.
  3. Поскольку вы используете таблицы, лучше не использовать a.позиция: абсолютная б.указав Top

Ниже приведен исправленный html:

<html xmlns="http://www.w3.org/1999/xhtml">
<head id="Head1" runat="server">
    <title></title>
    <style type="text/css">
        </style>

    <script language="javascript" type="text/javascript">
    </script>

</head>
<body>
    <form id="Form1" method="post" runat="server">
    <table width="50%">
        <tr>
        </tr>
        <tr align="center">
            <td align="center" valign="top">
                <asp:PlaceHolder runat="server" ID="phTextBoxes"></asp:PlaceHolder>
            </td>
            <td>
                <asp:Label ID="Instructions" runat="server" Font-Italic="True" Text="Now select from the dropdownlists which table columns from my database you want to map these fields to"></asp:Label>
            </td>
            <td align="center" >
                <asp:Button ID="btnSubmit" runat="server" Text="Submit" Width="150px" ></asp:Button>                
            </td>
        </tr>

            <tr>
                <td colspan="3" align="center" valign="top">
                <asp:Panel ID="pnlDisplayData" runat="server" Visible="False">
                    <asp:Literal ID="lTextData" runat="server"></asp:Literal>
                </asp:Panel>
                </td>
            </tr>

    </table>
    <table align="center">
        <tr>
            <td style="text-align: center; width: 300px;">
                <asp:Label ID="resultLabel" runat="server" Style="text-align: center;"
                    Visible="False"></asp:Label>
            </td>
        </tr>
    </table>
    <p>
    </p>
    </form>
</body>
</html>

Также проверьте, не перемещаете ли вы какие-либо элементы в коде позади.

НТН

0 голосов
/ 15 апреля 2010

Я не совсем уверен, как вы хотите, чтобы ваш конечный результат выглядел, поэтому я не знаю, зачем вам две таблицы. Будет ли это работать для вас? Я добавил свой собственный текст и включил все элементы управления, чтобы увидеть, где они окажутся на экране.

<html xmlns="http://www.w3.org/1999/xhtml" > 
<head id="Head1" runat="server"> 
    <title></title> 
    <style type="text/css"> 
    </style> 
    <script language="javascript" type="text/javascript"> 
    </script> 
</head> 
<body> 
    <form id="Form1" method="post" runat="server"> 
    <table >
        <tr>
            <td> 
                <asp:placeholder runat="server" id="Placeholder1"></asp:placeholder> 
            </td> 
            <td> 
                <asp:Label ID="Label1" runat="server" Font-Italic="True"   
                    Text="Now select from the dropdownlists which table columns from my database you want to map these fields to"></asp:Label> 
            </td> 
            <td> 
                <asp:button id="Button1" runat="server" text="Submit" width="150px"></asp:button> 
            </td> 
            <td>
                <asp:Label ID="Label2" runat="server" Visible="true" Text="result"></asp:Label> 
            </td>
        </tr>
        <tr>
             <asp:panel id="Panel1" runat="server" visible="true"> 
                <td> 
                    <asp:literal id="Literal1" runat="server" Text="test of literal control"></asp:literal> 
                </td>
            </asp:panel>
        </tr>
    </table>
    </form> 
    </body> 
</html>
0 голосов
/ 15 апреля 2010

Уменьшите или удалите тег "top" в вашем asp: Метка

<asp:Label ID="resultLabel" runat="server" style="position:absolute; text-align:center; top:148px; left: 155px;" Visible="False"></asp:Label>
0 голосов
/ 15 апреля 2010

Я не уверен, как вы хотите, чтобы эти 2 таблицы были расположены относительно друг друга, но попробуйте добавить border = "1" к тегу таблицы, чтобы увидеть, что происходит с вашими таблицами и ячейками.

0 голосов
/ 15 апреля 2010

Причина в том, что у вас есть встроенный CSS.

Удалить:

 top:148px; 

И опционально:

 left: 155px;
...