Shifting User Controls in .ASPX Markup
A question from a non-web-designer about the preferred - and least browser-sensitive - way of shifting users controls a few pixels horizontally and vertically if I'm using divs instead of table cells.
If you look at this top part of a web page, you will notice that the lower menu is a couple of pixels too far to the left and a couple pixels too high. (Note right edge doesn't line up with the menu above it. Also, tops of image buttons to the right of the lower control are clipped.)
Can I position them absolutely, or use white space to shift the lower one into alignment?
Here's a screenshot:
Here is the approximate markup:
<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>
With CSS use margin-left: (which can take a positive or negative value, usually in pixels)
margin-left:-5px;
When building menus and the such, it's easier to use styled, unordered lists.
加载中,请稍侯......
精彩评论