Left side navigation

rottwlrmom · #1 (**permalink**) 07-29-2007, 12:18 AM

Hi,

I've only created sites with top navigation and I really want one with left side nav.

I've created my buttons in photoshop / image ready and LOVE them but, HOW do I paste it into DW or keep the buttons from moving apart as I add text to the right of them??

You can see the buttons here: http://hollysfolly.com/newhome

Scroll over to get the full effect.

Thanks so much!

Holly

lisa · #2 (**permalink**) 07-29-2007, 10:05 AM

Hi Holly,

Maybe someone who is proficient in CSS (div classes, etc.) can show you a better way but I always just find a HTML template online that I like and you can paste your button code into the area provided for the left navigation.

Using tables, you create a left navigation by simply making a two column table with the left cell set a smaller width or percentage than the right cell.

Do you need help with the HTML for adding the images or the HTML for the left navigation?

rottwlrmom · #3 (**permalink**) 07-29-2007, 11:35 AM

Lisa, I'm not sure how to answer. I just can't add text to the right of the buttons I've made without them separating... they need to stop that!

I can't seem to place the links into an existing table and again, how do you stop them from moving apart once you add text?

lisa · #4 (**permalink**) 07-29-2007, 03:18 PM

I'm sorry, I guess I'm not understanding how you are adding the code to your images.

Can you use this template here...
http://www.2createawebsite.com/templates/template2.html

And paste your button code in the left side? You can change the colors, design, etc. later but maybe this will give you a basic start.

TechieGuy · #5 (**permalink**) 07-29-2007, 09:46 PM

I have looked at the source to your Web page and you seem to have a lot of table cells. Most of the cells are also spanning into other columns, which could be the reason your are having difficulty.

You only need two colums in the table so you should just have the following:

<table id="Table_01" width="800" height="667" border="0" cellpadding="0" cellspacing="0">
<tr>
<td>
[Your image buttons here]
</td>
<td>
[Your page content here]
</td>
</tr>
</table>

You can also use <div> but they are more complex to use since you do need a CSS file for them.

WB Sponsors