CSS help with inline list navigation

I'm trying to build my first site (learning how to code by hand) using
XHTML and CSS. I've done a lot of reading but I can't figure out
what's going on here. I'm trying to generate tabs for a horizontal
navigation system using only XHTML and CSS. I put up a section of
code at http://www.xmission.com/~mpyne/help_me/subnavonly.html. I
also put a screen capture of the code in 4 browsers (NS6.2, Mozilla
1.5, Opera 7.1, and IE6/Win) at
http://www.xmission.com/~mpyne/help_me/subnavonly.jpg.

I colored the different sections and used some borders so I can see
what's going on. NS & Moz look the same, but I get two other
renditions in Opera and IE6.

Questions:
1) What bugs in the browsers are causing the different renditions and
how can I correct or hack around them?
2) Why is the unordered list indented from the left? If you look at
the source, you'll see that I figured out a way around this, but I'm
not sure if it's the best or correct way. I want my tabs to be flush
left with the div.
3) Why is there space between when I remove the float from the
anchors? Is there some default spacing?

Any help is much appreciated. If you can point me to any links, etc.,
I can refer to, that is also very helpful. I've not been able to find
any for this problem.

Mike

re: CSS help with inline list navigation

googleid2003@yahoo.com (mp) wrote:
[color=blue]
> http://www.xmission.com/~mpyne/help_me/subnavonly.html
> http://www.xmission.com/~mpyne/help_me/subnavonly.jpg
>
> I colored the different sections and used some borders so I can see
> what's going on. NS & Moz look the same, but I get two other
> renditions in Opera and IE6.
>
> Questions:
> 1) What bugs in the browsers are causing the different renditions and
> how can I correct or hack around them?[/color]

Unusually, none that I can see at a glance. The dashed border only
appearing in bloatzilla is because "orange" is a "recent addition" /
"non-standard crap" to the colour keywords. Use a hex number like
#ffff00, instead of keywords.
[color=blue]
> 2) Why is the unordered list indented from the left? If you look at
> the source, you'll see that I figured out a way around this, but I'm
> not sure if it's the best or correct way. I want my tabs to be flush
> left with the div.[/color]

Because it's a list - browsers have been indenting lists for donkeys'
years. If you don't want the default styling of a list, why mark it as
a list? Are you sure this "list" actually contains listular data?

As you've already discovered, bloatzilla implements the indentation
with padding, Opera Explorer with margin. That's okay.

[color=blue]
> 3) Why is there space between when I remove the float from the
> anchors? Is there some default spacing?[/color]

Space between what and what when viewed with what?

re: CSS help with inline list navigation

Karl Smith wrote:[color=blue]
> googleid2003@yahoo.com (mp) wrote:
>[color=green]
>>2) Why is the unordered list indented from the left? If you look at
>>the source, you'll see that I figured out a way around this, but I'm
>>not sure if it's the best or correct way. I want my tabs to be flush
>>left with the div.[/color]
>
>
> Because it's a list - browsers have been indenting lists for donkeys'
> years.[/color]

Yes
[color=blue]
> If you don't want the default styling of a list, why mark it as
> a list?[/color]

Huh? The question should be "If you don't want the default styling of a
list, why not change it with CSS?" or "If you don't think it's a list,
why mark it as a list?"
--
Johannes Koch
In te domine speravi; non confundar in aeternum.
(Te Deum, 4th cent.)

re: CSS help with inline list navigation

*Karl Smith*:[color=blue]
>
> The dashed border only appearing in bloatzilla is because "orange"
> is a "recent addition" / "non-standard crap" to the colour keywords.[/color]

That's unlikely the reason, because virtually all desktop browsers since
Mosaic support the X11 color names and have done so for many years, i.e.
even before there was CSS.
To codify this ill set of color names, which was obviously assembled by some
stoned kids, in CSS is IMHO not a good thing, but for it is in SVG already
(with added 'gray'/'grey' variants) the CSS-WG will definitely put it into
CSS3 Color (not to become "Colour"). 'orange' however is one of the few sane
names therein and being officially introduced with CSS 2.1 already. It's
also the only one I frequently use when I'm to lazy to start a colour
picker.
[color=blue]
> Are you sure this "list" actually contains listular data?[/color]

Funny word, "listular".

--
Reality is an illusion that occurs due to the lack of alcohol.