HTML - Ie 6 Problem With My Navigation Menu?

I'm trying to build a horizontal menu that has tabs. Basically it's a horizontal 5px line with the inactive links/tabs upside down hanging from the line, and the active page having the tab above the line. But I'm having a heck of a time getting the css to work on the one tab on top (contact link shown here). Anyone have any ideas how I can accomplish this? You can see my css attempt below. Thanks!!



Code:

#menu
{
	width: 490px;
	height: 20px;
	padding-left: 300px;
	padding-top: 72px;
	border-bottom: 5px solid #b8ac85;
}

#menu.down
{
	width: 490px;
	height: 20px;
	padding-left: 300px;
	padding-top: 92px;
	border-bottom: 5px solid #b8ac85;
}

#menu ul {
	list-style: none;	
}

#menu li {
	
	display: inline; 
	
}

#menu.up ul {
	list-style: none;
	padding-top:40px;
}

#menu.up li {
	
	display: inline; 
	padding-top:-40px;
	
}

#menu a {
	float: left;
	width: 84px;
	height: 20px;
	display: block;
	text-align: center;
	text-decoration: none;
	color: #663300;
	font-weight: normal;
	font-size: 12px;
	text-transform: uppercase;
	padding-top: 5px;
	background: url(images/button_down.gif) no-repeat;
}

#menu a:hover {
	width: 84px;
        height: 20px;
	padding-top: 5px;
	color: #FFffff;
	text-decoration: underline;
}

#menu a.up:link {
	float: left;
	width: 84px;
	height: 20px;
	display: block;
	text-align: center;
	text-decoration: none;
	color: #663300;
	font-weight: normal;
	font-size: 12px;
	text-transform: uppercase;
	padding-top: 5px;
	background: url(images/button_up.gif) no-repeat;
}

#menu a.up:hover {
	width: 84px;
        height: 20px;
	padding-top: 5px;
	color: #FFffff;
	text-decoration: underline;
}

Does anyone know how to create this in Dreamweaver? I'm mostly interested in how the navigation bar jpg has sort of an image map idea to it (even though it's not an image map).

This is how the navigation bar looks in your html browsers:



This is how it looks without any CSS coding:



This is how the navigation bar's jpg looks alone:

(different states for how the navigation "button" will look when hovered over, clicked, etc)

Any help would be greatly appreciated!

I'm very new to HTML/CSS/Javascript. In the website I'm trying to build, I want to display a relatively simple navigation menu on the left side of the webpage, similar in look to the one here (example):
http://build-website.com/design/opportunity.html

Is there some way to put the initialization text for the navigation menu in a separate .html file (or, just some other file), so that every time I want to add a section/link to the nav menu, I won't have to go through each of my web pages individually and add the code for the link? (I am not going to use frames because, among other things, that would make it more difficult to bookmark and copy addresses of individual pages)

I have been teaching myself through the w3schools tutorials, but despite looking through them and googling for answers I haven't been able to find a solution. Is this possible in HTML? Something that would allow something like like <div src="navmenu.html"> would be ideal but I haven't been able to find anything.

(At the moment I'm just using notepad and typing in code manually)

Hello,
I am trying to figure out why I am having a problem with a drop-menu in Internet Explorer 6. The site I am currently working on is at http://www.falcolombardi.net/Saint%20Anne/. It appears fine in FireFox, but I am needing it to work in Internet Explorer as well. There is only one element that is needing to drop, and that's a 'Newsletter' option under the "Perish Life" link. Any help is greatly appreciated!

basicly my site works find on firefox, works fine on the most up to date internet explorer, but on internet explorer 5 or 6 it messes up abit! i cant find the problem


www.boldsac.co.uk thats the link.


if anyone knows why its doin this could you help me out please

I made a Custom BG for my navigation.. It possible to have a html/CSS code to add this BG under my navigation.. and have the links overlay on the BG?


Thanx In Advance!!!!

My web site

www.wayneactorscommunitytheatre.org

is having a problem with the navigation on some computers. Dong a mouse over on the header brings up a drop down list for navigation. Doing a mouse over these brings up others. On some computers this doesn't work and users are unable to connect to the lists that come up. It works great on a couple of system I have but two users have complained to me that on their XP internet Explorer it doesn't work. Anyone have any suggestion to how I can fix this? The xtml and css pages verify and I am at a loss as to what the problem is.

Okay, so I have a small issue here. I started a webcomic, and I'm now redesigning the website. I'm using SSI includes on my pages, and I'm having an issue with my navigation. I want to be able to include first comic/previous comic/next comic/current comic buttons, but the problem is this: with the previous comic/next comic buttons, I'm not really sure how to code it. I can't type in the name of the page I want it to go to, because then it'll be the same on every page. Is there a way around this? I figured I could tell it to go "next" and have it refer to "next" somewhere on the individual pages, which would send it to the next comic in the sequence, but I can't find the coding to do that, and I can't figure out the right way to word it to find it in a search. If I'm not too vague, can you guys help me out here?

Thanks!

Hey guys, I'm a designer trying to code my website which is problem number 1. I'm trying to crreate these solid rollover states for my graphic headers on my nav (about and contact). I found a site that I plugged code from using javascript which i dont' know. The "about" link works fine but the "contact" link effects teh about link instead of targeting itself. Any help you can offer I would really appreciate. Thanks!

here's my site:
http://www.bru.us.com


here's the code:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="en" xml:lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1" />
<title>BRU</title>
<link rel="stylesheet" type="text/css" href="bru.css" />




<script type="text/javascript">
var revert = new Array();
var inames = new Array('about','contact');


// Preload
if (document.images) {
var flipped = new Array();
for(i=0; i< inames.length; i++) {
flipped[i] = new Image();
flipped[i].src = "nav/"+inames[i]+"2.gif";
}
}

function over(num) {
if(document.images) {
revert[num] = document.images[inames[num]].src;
document.images[inames[num]].src = flipped[num].src;
}
}
function out(num) {
if(document.images) document.images[inames[num]].src = revert[num];
}
</script>






</head>

<body>
<div id="header">
<img src="images/logo_gold.gif" />
</div>

<div id="navigation">
<IMG SRC="images/nav_header_design.gif"/><br>

<a href="about.html"class="catlink">TowerGroup</a><br>
<a href="about.html"class="catlink">PSR</a><br>
<a href="about.html"class="catlink">Click&Buy</a><br>
<a href="about.html"class="catlink">MCA</a><br>
<a href="about.html"class="catlink">Incretin Forum</a><br>
<a href="about.html"class="catlink">Mastercard</a><br>
<a href="about.html"class="catlink">Baraclude</a><br>
<a href="about.html"class="catlink">IconNicholson</a><br>
<a href="about.html"class="catlink">FIFA</a><br>

<br>
<br>
<IMG SRC="images/nav_header_other.gif"/><br>
<a href="india_photos.html"class="catlink">India</a><br>

<br>
<br>
<a href="about.html"> <img src="nav/about1.gif" name="about" onMouseOver="over(0)" onMouseOut="out(0)"> </a><br><br>
<a href="mca.html"> <img src="nav/contact1.gif" name="contact" onMouseOver="over(0)" onMouseOut="out(0)"></a><br>



</div>






<div id="portfolio">
<IMG SRC="images/towergroupmarketing/tw_moodboard.jpg"/>&nbsp&nbsp&nbsp&nbsp


</div>

<div id="description">
<h1>TowerGroup / Moodboard</h1>
<p>
When TowerGroup came to us and talked about what they felt differentiated them from other
financial institutions, one thing that stood out to me, was that they wanted to communicate
that they're analysts are hands-on and accessible. To express this concept in a website, I
thought mixing hand-drawn illustrations with photographs would help give the site a more personable feel.
</p>


</div>

<!--Content-->
<div style="position:absolute; top:474px; left:499px;"></div>
</body>
</html>

Hello Folks,

I'm currently redesigning my site and am having a problem with the last bit!

I know that CSS is the method of choice now for web design but I need to integrate my site with a commercial shopping cart called Actinic. This uses tables and is virtually impossible to rewrite using CSS. It makes for a seamless integration if I stick with tables for my part of the site, and less headaches trying to make the two sites look the same.

I want to move some of the links away from the left hand column on the page and put them into a horizontal bar at the bottom.

I've created a tile which repeats, but I want it separated a bit from the left hand column.

Here's a url so you can see what I'm on about. http://www.magicalwonders.com/NewLook/Index.html

You will see that the blue bar created by my tile is stuck to the side of the left hand column. My problem arises in trying to move this bar to the right of the left hand column, so that there is a gap between the two.

I was hoping to avoid using a full size graphic as I want to keep the file size to a minimum. I've tried Cell Spacing & Padding which doesn't have any effect, so I've tried putting the background tile in between Div tags and specifying a width using the following code:-

<td align="center" ><Div width=300px id="footerbackground">Some links go Here</Div></td>

This hasn't worked though and the tile fills up the entire width of the cell that the Div is in.

I would be grateful if anybody can offer any advice.

Many thanks,

Myles

Hi Guys,

I am currently having a rather frustrating problem with my site menu. I have just installed a coppermine art gallery and have tried to place my site menu in there. However for some reason it malfunctions and I am not sure why this is ? I have copied the code across exactly as it appears on the main site and have copied the css for the menu into the coppermine css box. However something is making the menu malfunction. Your suggestions would be appreciated.

Hi can anybody see anything wrong with this code, sorry if its an obvious mistake im a begginner.


<div class="menu">
<table class="navbar" >
<tr>
<td class="menuNormal" width="100" onmouseover="expand(this);" onmouseout="collapse(this);" >
<p> Home </p>
<div class="menuNormal" width="155">
<table class="menu" width="155">
<tr>
<td class="menuNormal" > <a href="http:google.com" class="menuitem"> google </a> </td>
</tr>
<tr>
<td class="menuNormal" > <a href="http:google.com" class="menuitem"> google </a> </td>
</tr>
<tr>
<td class="menuNormal" > <a href="http:google.com" class="menuitem"> google </a> </td>
</tr>
<tr>
<td class="menuNormal" > <a href="http:google.com" class="menuitem"> google </a> </td>
</tr>
<tr>
<td class="menuNormal" > <a href="http:google.com" class="menuitem"> google </a> </td>
</tr>
</table>
</div>
</td>
</tr>
</table>
</div>

javascript:

function expand(s)
{
var td = s;
var d = td.getElementsByTagName("div").item(0);

td.className = "menuHover";
d.className = "menuHover";
}

function collapse(s)
{
var td = s;
var d = td.getElementsByTagName("div").item(0);

td.className = "menuNormal";
d.className = "menuNormal";
}


and css


td.menuNormal{
background-color: blue;
}

td.menuHover{
background-color:green;
}

Thanks

Hi, this is my first post on here and probably not my last, but I hope there are some experts that can help me out with this issue. I myself am extremely good with Flash and basic HTML but this problem has gone above my skills. Ok, so one of my clients had a template they wanted me to modify. Was mostly not a problem, but I am running into an issue with my Menu. It is a Flash/XML menu which works fine, but within the template there are some problems. The template itself uses HTML, CSS, and .js to call sections of the pages. Listed below is the URL and the problems. I hope someone can help and forgive me if this is not posted in the correct place.

1. Menu is visible on my Mac in both Firefox and Safari, but only in Firefox on my PC not IE6

2. Menu system is a dropdown and these are hidden behind the main table. Where the menu is are swf files which are called from a header.js file. I have added a z-index div command to try a allow the swf to come to the top level but this is not working.

www.bellydancecollege.com

I just started learning HTML yesterday, and I'm still getting a hang of it. I put a table menu on the side of my page, and I want to program it, so when my mouse hovers over a specific option, another menu appears, i'll post a link to show what i mean, incase what i stated is confusing. Appreciate all help.
http://www.dar-us-salam.com/
I want to do with my table/menu the same as this website, or in this format.

Thanks for the help

Peace

Hi,

On this website, http://www.knownbynika.nl the menu is not working properly on IE6 - 8. Is there a solution that it will also work on IE 6 - 8?
I've red something on the internet that I have to add some code but without any result

Thanks for the help!