easyeman
Active member
Hey, I am trying to design a header for our web site...and I'm having a little trouble. I basically have it looking how I want to, but for some reason it doesn't want to display right. I mean that in the program I'm using (Visual Web Developer) the design looks good, but when I switch to code and back, the words get jumbled up, but when I simply put a space and delete it, it all returns to normal. But it keeps doing that and I guess something in the code is making it do that so after it is saved and I try to preview it, it looks nothing like it should.
I'll attach the two pictures and code below so you can see what I'm getting and what I have coded. I just need help to see what is going on and why it is doing it. I've looked at everything and tried a few things, and I know it cannot be that hard since it is simple HTML, but for some reason I just cannot get it to appear right. So any help would be great, and hopefully someone can fix it and show me what was wrong. I greatly appreciate it.
http://www.nafeco.com/images/header_goal.jpg
http://www.nafeco.com/images/header_now.jpg
The first is how I want it to look and it does in the program, but then it ends up looking like the second picture when I switch to code and back and also in the previews in browser.
And here's the code that generates that header. Again, I greatly appreciate the help as I can't seem to get this looking right and have tried researching and different things, but I either butcher it more or it just ends up the same...
I'll attach the two pictures and code below so you can see what I'm getting and what I have coded. I just need help to see what is going on and why it is doing it. I've looked at everything and tried a few things, and I know it cannot be that hard since it is simple HTML, but for some reason I just cannot get it to appear right. So any help would be great, and hopefully someone can fix it and show me what was wrong. I greatly appreciate it.
http://www.nafeco.com/images/header_goal.jpg
http://www.nafeco.com/images/header_now.jpg
The first is how I want it to look and it does in the program, but then it ends up looking like the second picture when I switch to code and back and also in the previews in browser.
And here's the code that generates that header. Again, I greatly appreciate the help as I can't seem to get this looking right and have tried researching and different things, but I either butcher it more or it just ends up the same...
VB.NET:
<%@ Master Language="VB"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<script runat="server">
</script>
<html xmlns="http://www.w3.org/1999/xhtml" >
<head runat="server">
<title>NAFECO header</title>
</head>
<body>
<form id="form1" runat="server">
<div>
<table background="http://www.nafeco.com/images/header.jpg" width=772>
<tr>
<td rowspan="2">
<asp:HyperLink id="HyperLink1" runat="server" ImageUrl="http://www.nafeco.com/images/NAFECO_header_main.jpg" NavigateUrl="~/default.aspx"></asp:HyperLink></td>
<td colspan="6" style="height: 20px">
</td>
<td border="0" colspan="2" style="width: 10px; height: 20px;">
</td>
<td background="http://www.nafeco.com/images/header_menu.jpg" colspan="11" style="text-align: right; width: 194px; height: 20px;">
<span style="font-family:Arial"><asp:HyperLink id="HyperLink2" runat="server" NavigateUrl="~/default.aspx" CssClass="HeaderLink" Font-Size="10pt">Home</asp:HyperLink>
<asp:HyperLink ID="MyAccountLink" runat="server" CssClass="HeaderLink" NavigateUrl="~/Account/MyAccount.aspx" Font-Bold="False" Font-Size="10pt">My Account</asp:HyperLink>
<asp:HyperLink ID="HyperLink4" runat="server" CssClass="HeaderLink" NavigateUrl="~/info/ContactUs.aspx" Font-Size="10pt">Contact Us</asp:HyperLink>
<asp:HyperLink ID="HyperLink6" runat="server" CssClass="HeaderLink" NavigateUrl="~/info/AboutUs.aspx" Font-Size="10pt">About Us</asp:HyperLink>
<asp:HyperLink ID="HyperLink8" runat="server" CssClass="HeaderLink" NavigateUrl="~/info/FAQ.aspx" Font-Size="10pt">Help</asp:HyperLink>
<asp:HyperLink ID="SignInHL" runat="server" CssClass="HeaderLink" Font-Size="10pt">Log In</asp:HyperLink>
<asp:HyperLink ID="HyperLink3" runat="server" CssClass="HeaderLink" NavigateUrl="~/ShoppingCart.aspx" Font-Size="10pt">Cart</asp:HyperLink><asp:HyperLink ID="HyperLink5" runat="server" ImageUrl="http://www.nafeco.com/images/viewcart.gif" NavigateUrl="~/ShoppingCart.aspx"></asp:HyperLink></span></td>
</tr>
<tr>
<td colspan="1" style="height: 35px">
</td>
<td colspan="5" style="width: 15px; height: 35px;">
<br />
<span style="font-size: 8pt; color: #ffffff; font-family: Arial"></span>
<strong><span style="font-size: 7pt"><span style="font-family: Verdana"><span style="color: #ffffff">
</span></span></span></strong>
</td>
<td colspan="5" style="text-align: left; height: 35px;">
<strong><span style="font-size: 8pt; color: #ffffff; font-family: Arial">
<br />
North America
Fire Equipment Company</span></strong></td>
<td colspan="6" style="text-align: right; height: 35px;">
<asp:label id="LoginLabel" runat="server" font-names="verdana,arial" font-bold="True" font-size="6pt"
forecolor="white">You Are Not Signed In</asp:label><br />
<span style="font-size: 8pt; color: white; font-family: Arial"><strong>
Product Search:
</strong></span>
<input id="Text1" maxlength="30" name="txtSearch" size="14" align="right" style="font-size: 7pt;
width: 130px; font-family: Verdana, Arial; height: 16px" type="text" />
<input id="Image1" runat="server" src="http://www.nafeco.com/images/go.gif" type="image" style="width: 16px; height: 16px" /></td>
</tr>
</table>
</div>
</form>
</body>
</html>