Help! Inline Menu w/Padding Exceding DIV Container

[google]

I've been reading old posts and Googling all nite for solutions to my
problems, but I can't find any. I appreciate any help you can provide.

Here is the link to the problem web site:

http://fmp.freac.fsu.edu/Timeline/

These are the problems I can't solve:

- The padded list elements are taller than the containing div (note
the dark gray bar at the right). How can I fix this?

- The last list element (the red part) creates the right side of the
menu. It is supposed to stretch all the way to the right edge. How
can I do this?

- In Firefox, there is a 1 pixel space between the list indexes for
"Florida Photographic Collection" and "Online Classroom". I know these
problems are usually solved by removing newlines and other whitespace
characters, but I already have. How can I remove this?
If any of you wise people can advise me on how to fix some or all of
these issues, I promise to name my first-born child after you!

If I can't fix this, I'm gonna have to do it all in tables with spacer
gif's and javascript. Yuk!

Thanks!

-peter

[google]

I'm still messing with the page, so here is safe copy that will allow
you to see the problem without my ongoing debuggin and testing:

http://fmp.freac.fsu.edu/Timeline/sample.cfm

Thanks again!

-peter

[Els]

go****@warcode.com wrote:

Here is the link to the problem web site:

http://fmp.freac.fsu.edu/Timeline/
So I see - let me guess: Dreamweaver?
These are the problems I can't solve:
[snip problems]

I saw more problems than you just mentioned.
How about you first get a valid document?
Meaning: start with a doctype, then get to the html, and put the
stylebits into the head. Check with the validator before you post the
URL again - it's no use trying to find your errors when the basics are
already wrong.
If any of you wise people can advise me on how to fix some or all of
these issues, I promise to name my first-born child after you!
No need for such promises..
If I can't fix this, I'm gonna have to do it all in tables with spacer
gif's and javascript. Yuk!

No need for such threats either ;-)
(You already carried out the table part of the threat anyway)

--
Els http://locusmeus.com/
Sonhos vem. Sonhos vão. O resto é imperfeito.
- Renato Russo -

[Els]

go****@warcode.com wrote:

I'm still messing with the page, so here is safe copy that will allow
you to see the problem without my ongoing debuggin and testing:

http://fmp.freac.fsu.edu/Timeline/sample.cfm

It isn't any better than the first URL - still the same problems (I
don't mean the ones you mentioned).
--
Els http://locusmeus.com/
Sonhos vem. Sonhos vão. O resto é imperfeito.
- Renato Russo -

[google]

Depending on when you looked at it, it shouldn't have looked any
different.

Anyway, here is the sample page again, but now I have stripped out all
but the problematic code:

http://fmp.freac.fsu.edu/Timeline/sample.cfm

I should have done this in the first place - sorry!

Thanks again for any help you can offer.

-peter

[google]

OK, I believe I've solved most of my problems now. Check out this
additional sample page to see how far I've gotten:

http://fmp.freac.fsu.edu/Timeline/sample2.cfm

How do I make the red part stretch all the way to the right?

No width tricks seem to work. I'm wondering if the solution is to
actually the float the menu to the left of a new DIV that will contain
the red area with the white line underneath.

Any thoughts?

Thanks!

-peter

[Els]

go****@warcode.com wrote:

Depending on when you looked at it, it shouldn't have looked any
different.

Anyway, here is the sample page again, but now I have stripped out all
but the problematic code:

http://fmp.freac.fsu.edu/Timeline/sample.cfm

I should have done this in the first place - sorry!

Thanks again for any help you can offer.

I've now looked at your page 3 times.
Yes you've stripped out all of the code you weren't asking questions
about. And I can see the code if I first highlight all that's on the
page, and click 'view selection source'. Just trying to view source
gives me only <html><body></body></html>. Not a lot!

Anyway, you still haven't used a doctype, you still haven't validated
your code, I'm not gonna look again. I hope someone else with more
time on their hands will do that for you.

--
Els http://locusmeus.com/
Sonhos vem. Sonhos vão. O resto é imperfeito.
- Renato Russo -

[google]

Oh and I still have that 1 pixel gap between the "Florida Photographic
Collection" and "Online Classroom" menu items.

-peter

[google]

I appreciate you looking at my page 3 times, but I'm a bit confused by
your comments.

First of all, I am able to view source in both Firefox and Internet
Explorer. What browser are you using?

Second, according to the W3C CSS Validator, my page does validate:

http://jigsaw.w3.org/css-validator/v...ne/sample2.cfm

Thanks for your help!

-peter

[Els]

go****@warcode.com wrote:

I appreciate you looking at my page 3 times, but I'm a bit confused by
your comments.
:-(
First of all, I am able to view source in both Firefox and Internet
Explorer. What browser are you using?
An older version of Firefox. I was looking at sample.cfm, not
sample2.cfm btw, not sure if that makes any difference.
Second, according to the W3C CSS Validator, my page does validate:

http://jigsaw.w3.org/css-validator/v...ne/sample2.cfm

It validates as CSS! That's only the style part of your document.
I'm talking HTML. Without a doctype, all kinds of problems may arise,
so please use this validator to validate the HTML:
http://validator.w3.org/
--
Els http://locusmeus.com/
Sonhos vem. Sonhos vão. O resto é imperfeito.
- Renato Russo -

[google]

You know you can upgrade Firefox for free, right? Not sure why you're
giving advice to people on web stuff when you're not using a current
browser.

Anyway, the page now validates as valid html and the same problems are
still there:

http://fmp.freac.fsu.edu/Timeline/sample2.cfm

Are you ready to start making suggestions to fix my problems yet?

Thanks for all your help!

-peter

[Beauregard T. Shagnasty]

go****@warcode.com wrote:

Are you ready to start making suggestions to fix my problems yet?

Fix the font size so I can read it. Change the 0.6em to 100%, then
everyone can read it. Drop Verdana, too.

BTW, learn to quote the message you are replying to. Thanks.

--
-bts
-This space intentionally left blank.

[google]

> Fix the font size so I can read it. Change the 0.6em to

100%, then everyone can read it. Drop Verdana, too.
Done.
BTW, learn to quote the message you are replying to.
Thanks.

How's this? Using Google to post and it doesn't auto-quote.

Any suggestions for my problems? Just to remind everyone, I want to
make the red part stretch all the way to the right.

No width tricks seem to work. I'm wondering if the solution is to
actually the float the menu to the left of a new DIV that will contain
the red area with the white line underneath.

Thanks for all your help!

-peter

[Lou Cross]

Fix the font size so I can read it. Change the 0.6em to 100%, then
everyone can read it. Drop Verdana, too.

drop Verdana? what do you suggest as alternative?

[Beauregard T. Shagnasty]

Lou Cross wrote:

Fix the font size so I can read it. Change the 0.6em to 100%,
then everyone can read it. Drop Verdana, too.

drop Verdana? what do you suggest as alternative?

Verdana is too large a font. It makes authors set unrealistic sizes
such as the 0.6em above, rather than adjust their own browsers.

I use the following on my sites:

body {
font-family: "Trebuchet MS", Helvetica, Arial, sans-serif;
font-size: 100%; /* Override IE bug */
}

Trebuchet MS is pretty nice for a high percentage of Windows users,
and always use a fallback generic, which the OP had also left out.

--
-bts
-This space intentionally left blank.

[Steve Pugh]

"Lou Cross" <lo*******@gmail.com> wrote:

Fix the font size so I can read it. Change the 0.6em to 100%, then
everyone can read it. Drop Verdana, too.

drop Verdana? what do you suggest as alternative?

Almost anything.

Steve

--
"My theories appal you, my heresies outrage you,
I never answer letters and you don't like my tie." - The Doctor

Steve Pugh <st***@pugh.net> <http://steve.pugh.net/>

[Els]

go****@warcode.com wrote:

You know you can upgrade Firefox for free, right?
Yes, I've got Firefox 1.0, Firefox 0.8 and Firebird 0.6.
Not sure why you're
giving advice to people on web stuff when you're not using a current
browser.
How about "not all your visitors will have the newest browser, every
web author should make their site accessible to all visitors, not just
those with the latest versions."

My personal reason to use Firebird: it shows me errors that play up in
other browsers too. When I make a web site, I test in all new /and/
old browsers.
Anyway, the page now validates as valid html
Congrats ;-)
and the same problems are
still there:

http://fmp.freac.fsu.edu/Timeline/sample2.cfm

Are you ready to start making suggestions to fix my problems yet?
I was out today, am ready now :-)
Thanks for all your help!

no problem:
http://locusmeus.com/test/warcode.html
Maybe you'll want to use &nbsp; between words inside tabs, looks a bit
weird otherwise when it wraps.

--
Els http://locusmeus.com/
Sonhos vem. Sonhos vão. O resto é imperfeito.
- Renato Russo -