Link to home
Start Free TrialLog in
Avatar of ollybuba
ollybuba

asked on

HTML Right Navigation

I have a website that uses a left navigation page that loads on the left of every page of the website.  I have recently created a page to show pictures that I want to show on the right side of the page.  How do I code my webpages to encompass both the leftnav as well as another page on the right side?

Below is the html text that adds the leftnav to each webpage.

<td bgcolor="#ffffff" height="100%" valign="top" width="2"></td> 
        <td bgcolor="#ffffff" valign="top" width="189">@@BEGIN_OF_COMMENT#include file="leftnav.html" @@END_OF_COMMENT</td> 
        <td valign="top" width="4"></td> 
        <td bgcolor="#ffffff" valign="top" width="2"></td> 
        <td valign="top" width="558"> 

Open in new window

Thanks in advance.
Avatar of Scott Fell
Scott Fell
Flag of United States of America image

Can you please provide a link to your test page.  

I am confused.  You have code for the left side, but not the right? I may be missing something but I'm  not sure how to help with that.

In simple terms you can create a wrapper class with the width, then give the left class a width and float it left and do the same for the right class.  Just make sure the 2 widths equal the width of the wrapper in px or %
<div class="wrapper">
    <div class="col-left">left</div>
    <div class="col-right">right</div>
</div>

Open in new window

Avatar of ollybuba
ollybuba

ASKER

So out of this original code where would I insert and end the div command?

<center> 
  <table border="0" cellspacing="0" cellpadding="0" width="800" bgcolor="#000000" valign="TOP"> 
    <tbody> 
      <tr> 
        <td bgcolor="#ffffff" valign="top" width="800" align="center"><img width="800" src="/spaw/getimg.php?img=home_files/header.jpg" /></td> 
      </tr> 
    </tbody> 
  </table>@@BEGIN_OF_COMMENT Main Content Table @@END_OF_COMMENT 
  
  <table border="0" cellspacing="0" cellpadding="0" width="800" bgcolor="#ffffff"> 
    <tbody> 
      <tr> 
        <td bgcolor="#ffffff" height="100%" valign="top" width="2"></td> 
        <td bgcolor="#ffffff" valign="top" width="189">@@BEGIN_OF_COMMENT#include file="leftnav.html" @@END_OF_COMMENT</td> 
        <td valign="top" width="4"></td> 
        <td bgcolor="#ffffff" valign="top" width="2"></td> 
        <td valign="top" width="558"> 
          <table border="0" width="550"> 
            <tbody> 
              <tr> 
                <td colspan="3"></td> 
              </tr> 
              <tr> 
                <td colspan="3"> 
                  <div align="center"> 
                    <p><a href="/spaw/gethref.php?

Open in new window


            (starts the rest of the main page)
Are you using tables and tables inside of tables for a layout?    If so, stop and start over.  You are in for a mess and a broken site.

Start with a css grid and I prefer responsive.  http://getbootstrap.com/  or http://foundation.zurb.com/

In any case, you don't have enough code to help you.  I am actually even more confused. Your question states your code is for a left nav but your new code shows that in the 5th column.

Please create a very simple test page and post the link here or perhaps recreate it in jsbin.com or jsfiddle for us to look at.  

 http://css-tricks.com/reduced-test-cases/
Ya I did not add the right side code in yet.  I'm just modifying the page.  I didn't create it.  I was showing you the leftnav that is already in place.  I need to add a rightnav or page to it.
ASKER CERTIFIED SOLUTION
Avatar of Scott Fell
Scott Fell
Flag of United States of America image

Link to home
membership
This solution is only available to members.
To access this solution, you must be a member of Experts Exchange.
Start Free Trial