Header navigation bar issue...

Message Topic Search Topic Options Post Reply Create New Topic Printable Version Translate Topic

   Hi,

Here's another reason why a designer shouldn't attempt programming...

I am working with the header file, and I am trying to place a left navigation bar in which advertisements and links to other areas of the web site will go. (I don't want the categories, etc. that product cart gives in their default folder, but rather three blocks in which I can place images.) Trying to accomplish this using tables in the header file in dreamweaver.

I need the catalogue data to sit to the right of this navigation bar, but when I upload and view, all of the produt cart catologue data falls underneath my navigation bar. It makes for a very long, very sparse web page. First the header, then my nav bar, underneath that all the catologue info and finally the footer data.

Has anyone run into this, and do you have a solution? I am sure it is something fairly easy for those in the know....just can't figure it out on this end, and been banging up against it for days and days.

Thanks for your help! 

Jodi

P.S. Here's the code of the bar with my attempt at a left side navigation bar...

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<!--#include file="include-metatags.asp"-->
<html>
<head>
<%if pcv_PageName<>"" then%>
<title><%=pcv_PageName%></title>
<%end if%>
<%GenerateMetaTags()%>
<%Response.Buffer=True%> 
<%
Set conlayout=Server.CreateObject("ADODB.Connection")
conlayout.Open scDSN
Set RSlayout = conlayout.Execute("Select * From layout Where layout.ID=2")
Set rsIconObj = conlayout.Execute("Select * From icons WHERE id=1")
%>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<link href="ExuberanceStyleSheet.css" rel="stylesheet" type="text/css">
<link type="text/css" rel="stylesheet" href="pcStorefront.css" />
<style type="text/css">
<!--
.style1 {color: #A68C57}
-->
</style>
</head>
<body>
<div align="center">
  <table width="914" border="0" cellpadding="0" cellspacing="1" bgcolor="#453601">
    <tr>
      <td align="center"><img src="../../images/Christmas-Banner.gif" width="911" height="20"></td>
    </tr>
    <tr>
      <td height="96" valign="top" align="center">
        <table width="100%" border="0" cellpadding="0" cellspacing="0">
              <tr>
                <td align="left" valign="middle" bgcolor="#FFFFFF" style="padding-left:10px;"><img src="../../images/Exuberance-Linear-Logo-brow.gif" width="236" height="22" hspace="15"></td>
                <td align="right" valign="middle" bgcolor="#FFFFFF" style="padding-right:10px;">
                                    <span class="ToptitleBar"><span class="UltraTopLinks">
                                        <br>
                                        <a href="viewcontent.asp?idpage=5">body of knowledge</a><br>
                      <a href="viewContent.asp?idpage=18">organic &amp; natural products</a><br>
                      <a href="viewcontent.asp?idpage=8">press</a><br>
                      <a  href="viewcontent.asp?idpage=9">philosophy</a><b r>
                      <a href="viewCategories.asp">shop the boutique</a><br>
                                        <br>
                        </span></span>
              </td>
              </tr>
        </table>
      </td>
    </tr>
        <tr>
            <td width="100%" valign="top" bgcolor="#FFFFFF">
        <table width="144" border="0" cellpadding="0" cellspacing="0">
          <!--DWLayoutTable-->
          <tr>
            <td width="144" height="79"  valign="top"><!--DWLayoutEmptyCell-->&nbsp;< /td>
          </tr>
</table>
        <table width="144" border="0" cellpadding="0" cellspacing="0">
          <!--DWLayoutTable-->
          <tr>
              <td width="144" height="64"  valign="top"><!--DWLayoutEmptyCell-->&nbsp;< /td>
          </tr>
        </table>

Author	Message Topic Search Topic Options Post Reply Create New Topic Printable Version Translate Topic
Exuberance Members Profile Send Private Message Find Members Posts Add to Buddy List Newbie Joined: 14-December-2006 Status: Offline Points: 0	Post Options Post Reply Quote Exuberance Report Post Thanks(0) Quote Reply Topic: Header navigation bar issue... Posted: 14-December-2006 at 4:14pm
	Hi, Here's another reason why a designer shouldn't attempt programming... I am working with the header file, and I am trying to place a left navigation bar in which advertisements and links to other areas of the web site will go. (I don't want the categories, etc. that product cart gives in their default folder, but rather three blocks in which I can place images.) Trying to accomplish this using tables in the header file in dreamweaver. I need the catalogue data to sit to the right of this navigation bar, but when I upload and view, all of the produt cart catologue data falls underneath my navigation bar. It makes for a very long, very sparse web page. First the header, then my nav bar, underneath that all the catologue info and finally the footer data. Has anyone run into this, and do you have a solution? I am sure it is something fairly easy for those in the know....just can't figure it out on this end, and been banging up against it for days and days. Thanks for your help! Jodi P.S. Here's the code of the bar with my attempt at a left side navigation bar... <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <!--#include file="include-metatags.asp"--> <html> <head> <%if pcv_PageName<>"" then%> <title><%=pcv_PageName%></title> <%end if%> <%GenerateMetaTags()%> <%Response.Buffer=True%> <% Set conlayout=Server.CreateObject("ADODB.Connection") conlayout.Open scDSN Set RSlayout = conlayout.Execute("Select * From layout Where layout.ID=2") Set rsIconObj = conlayout.Execute("Select * From icons WHERE id=1") %> <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"> <link href="ExuberanceStyleSheet.css" rel="stylesheet" type="text/css"> <link type="text/css" rel="stylesheet" href="pcStorefront.css" /> <style type="text/css"> <!-- .style1 {color: #A68C57} --> </style> </head> <body> <div align="center"> <table width="914" border="0" cellpadding="0" cellspacing="1" bgcolor="#453601"> <tr> <td align="center"><img src="../../images/Christmas-Banner.gif" width="911" height="20"></td> </tr> <tr> <td height="96" valign="top" align="center"> <table width="100%" border="0" cellpadding="0" cellspacing="0"> <tr> <td align="left" valign="middle" bgcolor="#FFFFFF" style="padding-left:10px;"><img src="../../images/Exuberance-Linear-Logo-brow.gif" width="236" height="22" hspace="15"></td> <td align="right" valign="middle" bgcolor="#FFFFFF" style="padding-right:10px;"> <span class="ToptitleBar"><span class="UltraTopLinks"> <br> <a href="viewcontent.asp?idpage=5">body of knowledge</a><br> <a href="viewContent.asp?idpage=18">organic & natural products</a><br> <a href="viewcontent.asp?idpage=8">press</a><br> <a href="viewcontent.asp?idpage=9">philosophy</a><b r> <a href="viewCategories.asp">shop the boutique</a><br> <br> </span></span> </td> </tr> </table> </td> </tr> <tr> <td width="100%" valign="top" bgcolor="#FFFFFF"> <table width="144" border="0" cellpadding="0" cellspacing="0"> <!--DWLayoutTable--> <tr> <td width="144" height="79" valign="top"><!--DWLayoutEmptyCell--> < /td> </tr> </table> <table width="144" border="0" cellpadding="0" cellspacing="0"> <!--DWLayoutTable--> <tr> <td width="144" height="64" valign="top"><!--DWLayoutEmptyCell--> < /td> </tr> </table>

netprofits Members Profile Send Private Message Find Members Posts Add to Buddy List Certified ProductCart Developers Joined: 05-January-2006 Location: United States Status: Offline Points: 22	Post Options Post Reply Quote netprofits Report Post Thanks(0) Quote Reply Posted: 14-December-2006 at 4:36pm
	You aren't closing the left hand navigation column so all product cart's data will be right below your two content tables. After your final table above, add a closing </td> to close the left column and then an opening <td> tag to start the Product Cart center column. You may want to check the original header.asp code to define this td tag since there are some CSS styles defined there, i.e. <td id="pcCenter">
	NetProfits Internet Consulting Certified ProductCart Developer Our Site

Exuberance Members Profile Send Private Message Find Members Posts Add to Buddy List Newbie Joined: 14-December-2006 Status: Offline Points: 0	Post Options Post Reply Quote Exuberance Report Post Thanks(0) Quote Reply Posted: 14-December-2006 at 4:50pm
	Thanks for the wonderfully quick response! I've tried your suggestion, and something is definitely happening (and it is way more than I accomplished with all my trials and errors) but it isn't quite there yet, unfortunately... The catologue content has moved up, (yeay) but it is now all placing itself to the very far right, (off the original page in fact), so that my web site is now about 3000 px wide. The web site l;ooks normal - it's jsut the inner content that has popped itself off to the right. Any ideas? (Oh- and I can't tell you how much I appreciate your help!) Jodi Here's the new and improved code (you'l note I now have three boxes in the nav bar- but that is just a cosmetic change (intended to be anyway)) <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <!--#include file="include-metatags.asp"--> <html> <head> <%if pcv_PageName<>"" then%> <title><%=pcv_PageName%></title> <%end if%> <%GenerateMetaTags()%> <%Response.Buffer=True%> <% Set conlayout=Server.CreateObject("ADODB.Connection") conlayout.Open scDSN Set RSlayout = conlayout.Execute("Select * From layout Where layout.ID=2") Set rsIconObj = conlayout.Execute("Select * From icons WHERE id=1") %> <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"> <link href="ExuberanceStyleSheet.css" rel="stylesheet" type="text/css"> <link type="text/css" rel="stylesheet" href="pcStorefront.css" /> <style type="text/css"> <!-- .style1 {color: #A68C57} --> </style> </head> <body> <div align="center"> <table width="914" border="0" cellpadding="0" cellspacing="1" bgcolor="#453601"> <tr> <td align="center"><img src="../../images/Christmas-Banner.gif" width="911" height="20"></td> </tr> <tr> <td height="96" valign="top" align="center"> <table width="100%" border="0" cellpadding="0" cellspacing="0"> <tr> <td align="left" valign="middle" bgcolor="#FFFFFF" style="padding-left:10px;"><img src="../../images/Exuberance-Linear-Logo-brow.gif" width="236" height="22" hspace="15"></td> <td align="right" valign="middle" bgcolor="#FFFFFF" style="padding-right:10px;"> <span class="ToptitleBar"><span class="UltraTopLinks"> <br> <a href="viewcontent.asp?idpage=5">body of knowledge</a><br> <a href="viewContent.asp?idpage=18">organic & natural products</a><br> <a href="viewcontent.asp?idpage=8">press</a><br> <a href="viewcontent.asp?idpage=9">philosophy</a><b r> <a href="viewCategories.asp">shop the boutique</a><br> <br> </span></span> </td> </tr> </table> </td> </tr> <tr> <td width="100%" valign="top" bgcolor="#FFFFFF"> <table width="199" border="0" cellpadding="0" cellspacing="0"> <!--DWLayoutTable--> <tr> <td width="199" height="55" valign="top" bgcolor="#33CCCC"><!--DWLayoutEmptyCell-->&nbsp ;</td> </tr> </table> <table width="199" border="0" cellpadding="0" cellspacing="0"> <!--DWLayoutTable--> <tr> <td width="199" height="65" valign="top" bgcolor="#0000FF"><!--DWLayoutEmptyCell-->&nbsp ;</td> </tr> <tr> <td height="58" valign="top"><table width="199" border="0" cellpadding="0" cellspacing="0"> <!--DWLayoutTable--> <tr> <td width="199" height="58" valign="top" bgcolor="#3300CC"><!--DWLayoutEmptyCell-->&nbsp ;</td> </tr> </table></td> </tr> </table></td> <td>

netprofits Members Profile Send Private Message Find Members Posts Add to Buddy List Certified ProductCart Developers Joined: 05-January-2006 Location: United States Status: Offline Points: 22	Post Options Post Reply Quote netprofits Report Post Thanks(0) Quote Reply Posted: 14-December-2006 at 4:53pm
	Hi Jodi, can you post your URL so I can look at the source code of the live page?
	NetProfits Internet Consulting Certified ProductCart Developer Our Site

Exuberance Members Profile Send Private Message Find Members Posts Add to Buddy List Newbie Joined: 14-December-2006 Status: Offline Points: 0	Post Options Post Reply Quote Exuberance Report Post Thanks(0) Quote Reply Posted: 14-December-2006 at 4:57pm
	I'd love too...but it's not yet live. Can I email you directly the link and info to access the working page so you can take a peek? Scratch that last post...I'm giving my inexperience away! Here's the link to one of the pages. http://exuberanceb.web121.discountasp.net/store/pc/viewConte nt.asp?idpage=5 Edited by Exuberance - 14-December-2006 at 5:01pm

netprofits Members Profile Send Private Message Find Members Posts Add to Buddy List Certified ProductCart Developers Joined: 05-January-2006 Location: United States Status: Offline Points: 22	Post Options Post Reply Quote netprofits Report Post Thanks(0) Quote Reply Posted: 14-December-2006 at 4:58pm
	Actually I think I see the problem...you're closing the whole table at the bottom of the file when you should only be closing the left column. Remove this code from the bottom: </tr> </table></td> so that your code looks like this: td height="58" valign="top"><table width="199" border="0" cellpadding="0" cellspacing="0"> <!--DWLayoutTable--> <tr> <td width="199" height="58" valign="top" bgcolor="#3300CC"><!--DWLayoutEmptyCell-->&nbsp ;</td> </tr> </table></td> <td>
	NetProfits Internet Consulting Certified ProductCart Developer Our Site

Exuberance Members Profile Send Private Message Find Members Posts Add to Buddy List Newbie Joined: 14-December-2006 Status: Offline Points: 0	Post Options Post Reply Quote Exuberance Report Post Thanks(0) Quote Reply Posted: 14-December-2006 at 5:23pm
	Hi... Waiting with baited breath hoping you don't get tired of this puzzle...! I tried the above, but everything moved down from the top and I was left with big gaps. Also, the footer file isn't showing up correctly now. Next, I tried putting in new tables and then doing the same thing; but now both items have shifted over the left. Here's the link... http://exuberanceb.web121.discountasp.net/store/pc/viewConte nt.asp?idpage=5 and here is the code.(I'm hoping you're the tenacious sort... !!!) Jodi <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <!--#include file="include-metatags.asp"--> <html> <head> <%if pcv_PageName<>"" then%> <title><%=pcv_PageName%></title> <%end if%> <%GenerateMetaTags()%> <%Response.Buffer=True%> <% Set conlayout=Server.CreateObject("ADODB.Connection") conlayout.Open scDSN Set RSlayout = conlayout.Execute("Select * From layout Where layout.ID=2") Set rsIconObj = conlayout.Execute("Select * From icons WHERE id=1") %> <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"> <link href="ExuberanceStyleSheet.css" rel="stylesheet" type="text/css"> <link type="text/css" rel="stylesheet" href="pcStorefront.css" /> <style type="text/css"> <!-- .style1 {color: #A68C57} --> </style> </head> <body> <div align="center"> <table width="914" border="0" cellpadding="0" cellspacing="1" bgcolor="#453601"> <tr> <td align="center"><img src="../../images/Christmas-Banner.gif" width="911" height="20"></td> </tr> <tr> <td height="96" valign="top" align="center"> <table width="100%" border="0" cellpadding="0" cellspacing="0"> <tr> <td align="left" valign="middle" bgcolor="#FFFFFF" style="padding-left:10px;"><img src="../../images/Exuberance-Linear-Logo-brow.gif" width="236" height="22" hspace="15"></td> <td align="right" valign="middle" bgcolor="#FFFFFF" style="padding-right:10px;"> <span class="ToptitleBar"><span class="UltraTopLinks"> <br> <a href="viewcontent.asp?idpage=5">body of knowledge</a><br> <a href="viewContent.asp?idpage=18">organic & natural products</a><br> <a href="viewcontent.asp?idpage=8">press</a><br> <a href="viewcontent.asp?idpage=9">philosophy</a><b r> <a href="viewCategories.asp">shop the boutique</a><br> <br> </span></span> </td> </tr> </table> </td> </tr> <tr> <td width="199" valign="top" bgcolor="#FFFFFF"><tr><td height="58" valign="top"><!--DWLayoutEmptyCell--> < /td> <td> <table width="199" border="0" cellpadding="0" cellspacing="0"> <!--DWLayoutTable--> <tr> <td width="199" height="55" valign="top"><div align="left"><img src="../../images/beautyblog.gif" width="216" height="50"></div></td> </tr> <tr> <td height="49" valign="top"><table width="224" border="0" cellpadding="0" cellspacing="0"> <!--DWLayoutTable--> <tr> <td width="199" height="48" valign="top" bgcolor="#99CC00"><!--DWLayoutEmptyCell-->&nbsp ;</td> </tr> </table></td> <td>

netprofits Members Profile Send Private Message Find Members Posts Add to Buddy List Certified ProductCart Developers Joined: 05-January-2006 Location: United States Status: Offline Points: 22	Post Options Post Reply Quote netprofits Report Post Thanks(0) Quote Reply Posted: 14-December-2006 at 5:51pm
	You have one table (with several tabes nested inside of that). The top and bottom rows only have one column but your center row has two columns. That is throwing everything off. Also the total width of your center row is wider then the top or bottom rows. You can do two things: 1. Make sure you use colspan="2" in the top and bottom rows so they coordinate with the center row. 2. Split it into three tables. One for the banner section on top, one for the content area including the left navigation, and one for the footer area. Hope this helps.
	NetProfits Internet Consulting Certified ProductCart Developer Our Site