在.ASPX标记中移动用户控件

时间:2011-01-13 20:42:56

标签: asp.net html

如果我使用的是div而不是表格单元格,那么非网页设计师提出的一个问题是关于首选 - 也是浏览器最不敏感 - 转换用户的方式会水平和垂直控制几个像素。

如果你看一下网页的这个顶部,你会发现下面的菜单是左边几个像素,而几个像素太高了。 (注意右边缘不与其上方的菜单对齐。另外,下方控件右侧的图像按钮顶部被剪裁。)

我可以绝对定位它们,还是使用空格将较低的空间移动到对齐状态?

这是一个截图: alt text

这是近似的标记:

<body id="bodyTag" runat="server">
    <form id="Form1" method="post" runat="server">
        <asp:ScriptManager ID="ScriptManager1" runat="server"></asp:ScriptManager>
        <div id="divAll" runat="server" style="visibility:visible;">
            <div id="divPrintHeaders" style="visibility:hidden; width: 923px;height:70px;">
                <asp:ImageButton ID="printCompanyLogoImageButton" ImageUrl="~/Images/TopNav/MainLogoImage.gif" 
                    runat="server"></asp:ImageButton>
                <asp:Image ID="printPageTitleImage" ImageUrl="~/Images/PageTitle/Product_Title.gif" runat="server"></asp:Image>
                <br />
            </div>
            <div id="divMainHeaders" style="z-index:10;">
                <ZZ:TopNavCtrl ID="topNavCtrl" runat="server"/>
                <div style="margin-top:-13px;margin-left:-4px;height:31px;z-index : 25;">
                    <ZZ:MyMenuControl ID="myMenu" runat="server" OnMyMenu="myMain_DoStuff" />
                </div>
            </div>
            <div style="LEFT: 12px; POSITION: absolute; TOP: 120px">
                <ZZ:SomeControl id="something" runat="server"></ZZ:SomeControl>
                <!-- Several more controls here ... -->
                <table border="0" cellpadding="0" cellspacing="0" 
                    style=" background-color: #ffffff; LEFT: 0px; POSITION: relative; TOP: 100px; width: 740px; height: 50px;">
                    <tr valign="middle">
                        <td>
                            <asp:PlaceHolder id="footerPlaceHolder" runat="server"></asp:PlaceHolder>
                        </td>
                    </tr>
                </table>
            </div>
        </div>
    </form>
</body>

1 个答案:

答案 0 :(得分:2)

使用CSS margin-left:(可以采用正值或负值,通常以像素为单位)

margin-left:-5px;

在构建菜单等时,使用styled, unordered lists更容易。