I'm just about to head home for the day... and I'm in a bit of a crunch to get this clued up.

Take a look and let me know what you find:
GEO GIFTS


Again, i tested in IE... *shakes head*, and I let problems creep in.
Will I ever learn, haha.

It works great in IE.. but there are a few display problems in firefox.

Thanks guys! This place is great!

Why is the menu on your News page missing so many of your other nav items ??? It should be kept consistent.

I don't see too many display problems in FF, a couple of very minor things. It's tables.. lots of hair-pulling problems with them.

You've got a <span> wrapped around divs and table cells ?? Not valid markup and no wonder you're having troubles (beside the fact that its a morass of nested tables).

The validator choked on 43 errors in your HTML.. you should fix those first and some of the problems will probably go away.

I also noticed that heavy CSSing makes FireFox dizzy, it blinks the layers until it can finally get them positioned well, It happend with ads mostly from websites like launch.yahoo.com or CNN.Com maybe its my system at work im in a Windows 2000 station.. I'll check at home

I agree

Heh.. I figured I shouldn't have shown you guys the GEO GIFTS site within the main geo centre website. The whole site is a lost cause until someone sits down and redesigns, and develops it properly.

I was hired on to develop the GEO GIFTS portion of the site. I developed it outside the main site on it's own, and then transplanted it into the content area.

I'll work on the errors of the Geo Gifts page, and when that displays properly.. I'll be happy.

Alright, i changed that span to a div.. and added a width to the table that was giving me problems.

It seems that my problem is my navigation. Seems like the left margin or something is doubling, but I don't know where that's happening and adding "display: inline;" isn't fixing it.

Here's the css:

#nav {
  font-family: verdana, tahoma, arial;
  display: inline;
  width: 515px;
  margin:0;
  float:right;
  }
#nav ul {
  list-style:none;
  }
#nav li {
  float:left;
  display: inline;
  line-height:20px;
  padding:  10px 16px 10px 16px;
  border-left:1px solid #fff;
  font-weight:bold;
  font-size : 11px;
  list-style:none;
  }
  
#nav li.first {
  border-left-width:0;
  }
#nav li.firstselected {
  border-left-width:0;
  background: #ffffff;
  }
  
#nav li.selected {
  background: #ffffff;
  }
  
#nav a {
  text-decoration:none;
  color: #0182AC;
  }
#nav a:hover {
  color:#0182AC;
  text-decoration:underline;
  }

i removed my " float:right; "
and that solved it.

Thanks anyway guys!

Good you solved it

Heh.. I figured I shouldn't have shown you guys the GEO GIFTS site within the main geo centre website. The whole site is a lost cause until someone sits down and redesigns, and develops it properly.

After going thru the site I kinda figured that was the case. It's difficult do just one piece and drop it in to an existing site.

IE has a margin-doubling bug on floated elements. If you float:right and then give it margin-right: xx px;, IE will DOUBLE that margin. It only does it when the float and the margin are going in the same direction. The solution is to put "display: inline" in the floated element and the doubling will go away.

Glad you got it fixed. It looks pretty good for what you had to work with .

there is also a RIGHT: "tag" in CSS Very useful trust me!

a "RIGHT:" tag?? please explain further, thanks!

and thanks, I did what I could within the restraints of having to make a page within a page. I wanted to keep the design simple, but I think I still may have went a little overboard. Oh well, it's fine until the whole site gets redesigned.

CSS doesn't have "tags" only properties and values.