Blank space arrangement in asp.net design page

Question

I have a created a profile page for my website, there is a photo, upload button and a fileUpload control. Controls such as First name/ last name etc are placed In a panel separate from image and image control. The problem is that Panel leaves a huge margin from top (I haven't given margin-top). I want to remove that white space. I have tried a couple of things such as providing position (absolute/relative) and I tried to rearrange the controls but didn't work

    .common 
    {
        float: left;
        position: relative;
    }

    .Panel 
    {
        margin-right: 50px;
        padding: 20px;
        float: right;
    }

    .layWork 
    {
        border: white 2px solid;
        width: 800px;
        background-color: white;
        border-radius: 50px;
        height: 700px;
        margin: 50px 0px 20px 50px; 
    }

    <div class="layWork">
        <div class="Frontier">
            <br />
            <br />
            &nbsp;&nbsp;&nbsp;&nbsp;
            <asp:Image ID="Shasshin" runat="server" src="../Property/EmptyIcon.png" Height="200px" Width="200px" cssClass="common"/>
            <br />
            &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
            &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
            <asp:Panel ID="proPan" runat="server" CssClass="Panel">
                <asp:Label ID="proFNameLabel" Text="First Name : " runat="server" />
                <asp:TextBox ID="proFNameBox" runat="server" Text=""/>
                <br /><br />
                <asp:Label ID="proLNameLabel" Text="Last Name : " runat="server" />
                <asp:TextBox ID="proLNameBox" runat="server" Text="" />
                <br /><br />
                <asp:Label ID="proAge" Text="Age : " runat="server" />
                <asp:TextBox ID="proAgeBox" runat="server" />
                 <br /><br />
                <asp:Label ID="proBirth" Text="Birthdate : " runat="server"/>
                <asp:TextBox ID="proBirthBox" runat="server"/>
                <br /><br />
                <asp:Label ID="proLoc" Text="Localtion : " runat="server" />
                <asp:TextBox ID="proLocBox" runat="server" />
                <br /><br />
                <asp:Label ID="proNumber" Text="Phone : " runat="server" />
                <asp:TextBox ID="proNumBox" runat="server" />
                <br /><br />
                <asp:Label ID="SkypeID" Text="Skype ID : " runat="server" />
                <asp:LinkButton ID="proSkype" runat="server">Link</asp:LinkButton>
                <br /><br />
                <asp:Label ID="proDesc" Text="Description : " runat="server" />
                <asp:TextBox ID="proDescBox"  TextMode="MultiLine" runat="server" />
                <br /><br />
                <asp:Label ID="proDev" Text="Developer : " runat="server" />
                <asp:TextBox ID="proDevBox" runat="server" />
            </asp:Panel>
            <asp:FileUpload ID="PhotoPicker" CssClass="common" runat="server" /><br />
            <asp:Button ID="PhotoSender" runat="server" cssClass="common" Text="Upload" /> 
        </div>
    </div>

Possible duplicate of [White space at top of page](https://stackoverflow.com/questions/18772154/white-space-at-top-of-page) — , Jan 24 '18 at 05:25
Is it the same in all browsers? Quantify "huge" - maybe with a screenshot? — SherylHohman, Jan 24 '18 at 05:48

score 0 · Answer 1 · answered Jan 24 '18 at 08:13

I use table generally ,so this may help.

<table>
                <tr>
                    <td style="vertical-align:top">  <asp:Image ID="Shasshin" runat="server" src="../Property/EmptyIcon.png" Height="200px" Width="200px" cssClass="common"/></td>
                    <td>&nbsp;&nbsp;&nbsp;</td>
                    <td style="vertical-align:top"> <asp:Panel ID="proPan" runat="server" CssClass="Panel">
                <asp:Label ID="proFNameLabel" Text="First Name : " runat="server" />
                <asp:TextBox ID="proFNameBox" runat="server" Text=""/>
                <br /><br />
                <asp:Label ID="proLNameLabel" Text="Last Name : " runat="server" />
                <asp:TextBox ID="proLNameBox" runat="server" Text="" />
                <br /><br />
                <asp:Label ID="proAge" Text="Age : " runat="server" />
                <asp:TextBox ID="proAgeBox" runat="server" />
                 <br /><br />
                <asp:Label ID="proBirth" Text="Birthdate : " runat="server"/>
                <asp:TextBox ID="proBirthBox" runat="server"/>
                <br /><br />
                <asp:Label ID="proLoc" Text="Localtion : " runat="server" />
                <asp:TextBox ID="proLocBox" runat="server" />
                <br /><br />
                <asp:Label ID="proNumber" Text="Phone : " runat="server" />
                <asp:TextBox ID="proNumBox" runat="server" />
                <br /><br />
                <asp:Label ID="SkypeID" Text="Skype ID : " runat="server" />
                <asp:LinkButton ID="proSkype" runat="server">Link</asp:LinkButton>
                <br /><br />
                <asp:Label ID="proDesc" Text="Description : " runat="server" />
                <asp:TextBox ID="proDescBox"  TextMode="MultiLine" runat="server" />
                <br /><br />
                <asp:Label ID="proDev" Text="Developer : " runat="server" />
                <asp:TextBox ID="proDevBox" runat="server" />
            </asp:Panel></td>
                </tr>
                <tr>
                    <td> <asp:FileUpload ID="PhotoPicker" CssClass="common" runat="server" /></td>
                    <td> <asp:Button ID="PhotoSender" runat="server" cssClass="common" Text="Upload" /> </td>
                </tr>
            </table>

Blank space arrangement in asp.net design page

1 Answers1