Tue, 2012-01-10 21:12

I would like contents of the menu to be aligned with the centered content-not all theway pver to the left.
My master page markup is shown below followed by test.css
Thank you
<%@ Master Language="VB" CodeFile="Test.master.vb" Inherits="Test" EnableTheming="true" %> <!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> <link href="../Styles/Test.css" rel="stylesheet" type="text/css" /> <link href="../Styles/sds.css" rel="stylesheet" type="text/css" /> <link href="../Styles/Style_Menu_new.css" rel="stylesheet" type="text/css" /> <asp:ContentPlaceHolder id="head" runat="server"> </asp:ContentPlaceHolder> </head> <body> <form id="form1" runat="server"> <div id="header"> <div class="wrap"> <div class="logo"> <div style="position:relative;float:left;margin-left:0px;margin-top:20px;"> <asp:ImageButton ID="btnFeedback" runat="server" ImageUrl="../Images/miscellaneous/feedback_h.gif" /> </div> <div style="position:relative;float:left;margin-left:100px;margin-top:20px;width:300px;"> <asp:Image ID="Image1" runat="server" ImageUrl="~/images/logo.png" AlternateText="logo" Height="80px" Width="160px" /> </div> <div id="loginarea" style="position:relative;float:right;margin-right:10px;"> <div style="position:relative;float:right;margin-top:20px;"> <asp:Image ID="imgDoor" runat="server" ImageUrl="~/images/icons/door.png" AlternateText="log out" /> </div> <div style="position:relative;float:right;margin-right:8px;margin-top:2px;"> <asp:LoginStatus ID="LoginStatus1" runat="server" SkinID="Primary" style="position:relative;float:left;margin-top:20px; margin-left:10px; text-decoration:none;color:#000;font-size:0.6em;" LogoutPageUrl="~/exit-to-logout.aspx" LoginText="LOGIN" LogoutText="LOGOUT" LogoutAction= "Redirect" /> </div> <div style="position:relative;float:right;margin-top:20px;margin-right:5px;"> <asp:Label ID="lblPipe1_" runat="server" CssClass="label" style="font-size:0.7em;" Text="|"/> </div> <div style="position:relative;float:right;margin-top:20px;margin-right:10px;"> <asp:Label ID="lblLogInName" runat="server" CssClass="label" style="font-weight:bold;font-size:0.7em;" Text=""/> </div> <div style="clear:right;position:relative;float:right;margin-top:5px;margin-right:2px;"> <asp:Label ID="lblApp_" runat="server" CssClass="label" style="font-weight:bold;font-size:0.7em;" Text="Current App:" /> <asp:Label ID="lblApp" runat="server" CssClass="label" style="font-weight:normal;font-size:0.7em;" Text="Current App" /> </div> </div> <div class="clear"></div> <div style="position:relative;float:right;margin-right:10px;"> <asp:LinkButton ID="lnkMyDeals" runat="server" style="margin-right:10px;text-decoration:none;font-weight:bold;font-size:0.7em;color:black;" CausesValidation="false" >My Deals</asp:LinkButton> <asp:LinkButton ID="lnkMyProfile" runat="server" style="margin-right:10px;text-decoration:none;font-weight:bold;font-size:0.7em;color:black;" CausesValidation="false" >Profile</asp:LinkButton> <asp:LinkButton ID="lnkMyAccount" runat="server" style="margin-right:10px;text-decoration:none;font-weight:bold;font-size:0.7em;color:black;" CausesValidation="false" >Account</asp:LinkButton> <asp:Label ID="lblMessagesCount" runat="server" Text="" Font-Bold="true" Font-Size="0.7em" ForeColor="#333366" Font-Names="Verdana,Arial,San-Serif" /> <asp:ImageButton ID="ImageButton_Messages" runat="server" ImageUrl="~/Images/icons/AlertIcons/envelope.png" AlternateText="Messages" ToolTip="Messages" style="margin-bottom:-5px;" CausesValidation="false" /> <asp:LinkButton ID="lnkMessages" runat="server" style="margin-right:10px;margin-left:5px;text-decoration:none;font-weight:bold;color:black;font-size:0.7em;" CausesValidation="false" >Messages</asp:LinkButton> <div class="clear"></div> </div> </div> </div> <ul id="topnav" class="topnav" runat="server" > <li> <a href="home.aspx">Updates</a> </li> <li> <a id="aNavDeals" runat="server" href="mydeals.aspx">Deals</a> <!--Subnav Starts Here--> <span id="dealSubnav" runat="server" > <a href="mydeals.aspx">My Deals</a> | <a href="invitations.aspx">Invitations</a> | <a style="display:none;" href="joindeal.aspx" >Join Negotiation</a> <a style="display:none;" href="InviteDealHost.aspx">Invitations</a> <a style="display:none;" href="DealStorage.aspx">DealStorage</a> </span> <!--Subnav Ends Here--> </li> <!-- <li><a href="milestones_all.aspx">Milestones</a></li> <li><a href="properties.aspx">Properties</a></li> --> <li><a href="people.aspx">People</a></li> </ul> <div class="clear"></div> </div> <div> <asp:ContentPlaceHolder id="ContentPlaceHolder1" runat="server"> </asp:ContentPlaceHolder> </div> <div id="footer"> <div class="wrap"> <div style="position:relative;float:left;margin-left:380px;margin-top:50px;"> <asp:Label ID="lblFooter" runat="server" CssClass="label-small" Text="Copyright © Cobroke Nation LLC 2010"/> </div> <div style="clear:left;position:relative;float:left;margin-left:440px;;margin-top:5px;"> <asp:HyperLink ID="hypContactUs" runat="server" Text="Contact Us" NavigateUrl="~/protected/contactus_members.aspx"/> </div> <asp:HyperLink ID="hypAdmin" NavigateUrl="admin/adminpanel.aspx" runat="server">Admin</asp:HyperLink> </div> </div> </form> </body> </html>
.wrap { position:relative; margin:0 auto; width:980px; } #header, #footer { width:100%; float:left; } #header { background-color:#c7e5fb; }
Thu, 2012-01-12 13:18
#1
Too many unneeded DIVs. Too
Too many unneeded DIVs. Too much inline styling. Unnecessary use of server controls. Just because there is an ASP.NET equivalent of an HTML tag doesn't mean you must use it. If you're not processing it in the code behind just use a normal HTML tag with no RUNAT. That is some insanity you have going on there.
Try this:
#topnav { display: table; margin: auto; }