CSS-P issue

[Greg]

I've got a page done with all CSS with the exception of one table used
for a navigation menu. I have the navigation table in a <div> that is
positioned 175 pixels from the top. I have the content in a <div> also
that is also positioned 175 pixels from the top. In IE 6 it looks fine
and the text lines up with the top of the menu. However in Mozilla the
text appears below the menu by 10 or so pixels. Any Idea why? The url
is here:

http://www.goforthdesigns.com/test

Thanks for any help.

greg g.

 

[Brian]

http://www.goforthdesigns.com/test

I took the liberty of comparing the test page with the current home
page. On the home page, I see tiny font-size, and a graphic that
wastes 1/3 of my browser window. The test site is an improvement, but
still suffers from some of the same problems.

I've got a page done with all CSS with the exception of one table
used for a navigation menu. I have the navigation table

....which is not tabular data. Why not mark it up as a list?

in a <div> that is positioned 175 pixels from the top. I have the
content in a <div> also that is also positioned 175 pixels from the
top. In IE 6 it looks fine and the text lines up with the top of
the menu. However in Mozilla the text appears below the menu by 10
or so pixels. Any Idea why?

It could be the h2 margin. Try explicitly setting a margin-top for
h2, and see if you can get them to line up as you'd like.

You have more important problems than a 10-pixel placement problem.
(I didn't really notice the difference in the placement right away.)
For starters, there is no level-1 heading on the page, but there is a
h2. For another thing, there is a lot of wasted space in the window.
Turn images off, and load the page, and you'll see what I mean. The
nav links on the left of the page are all images for text, when text
with css would have done as nicely. Thus, the links do not scale.
And the image-as-text is white on grey, which is hard to read.

From your css:

p {
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: .9em;

Best not to specify Verdana, for reasons discussed numerous times in
ciwas. (Use Google to find those threads if you missed them the first
100 times. ;-) ) And please don't specify .9em for paragraph font
size. My preferred font-size is not 90% of the font-size I set in my
browser. It is 100% of that font-size.

 

[greg]

And please don't specify .9em for paragraph font

size. My preferred font-size is not 90% of the font-size I set in my
browser. It is 100% of that font-size.

I don't get it. First I specify in pixels and people on this board act like
the sky is falling. Change it to EMS they say, so I do. Now that I did,
I'm told to use percents.....which is it? I didn't like how big the font
was at 1 em so I made it smaller. How do you suggest I make it smaller?

For starters, there is no level-1 heading on the page, but there is a
h2.

Why does this matter? I didn't want something as big as an h1. And I
actually do use H1 tags in some of the pages. I appreciate any comments, but
it really does me no good when I keep hearing different things from
different people.

-g-

 

[PeterMcC]

I don't get it. First I specify in pixels and people on this board
act like the sky is falling. Change it to EMS they say, so I do.
Now that I did, I'm told to use percents.....which is it? I didn't
like how big the font was at 1 em so I made it smaller. How do you
suggest I make it smaller?

1em=100% so the 0.9em is the same as 90%, no contradiction there, just a
different terminology. AFAICS, the comment wasn't about the method used to
make it smaller, it was that you had made it smaller.

Why does this matter? I didn't want something as big as an h1. And I
actually do use H1 tags in some of the pages.

Then make the H1 smaller - but, implied by the above, not smaller than the
user's chosen 1em/100% font size setting.

I appreciate any
comments, but it really does me no good when I keep hearing different
things from different people.

Not different things, just different ways of saying the same thing - that
one should use font sizes relative to the user's preferences which means
using ems or percentages and you should think about readability before you
use sizes below 1em/100%

 

[Brian]

I don't get it. First I specify in pixels and people on this board act like
the sky is falling. Change it to EMS they say, so I do. Now that I did,
I'm told to use percents

As PeterMcC has already been pointed out, percent or em is a matter of
terminology. FWIW, I use percent because I find them easier. But
they are interchangeable.

......which is it?

Either one. But make it 1em, not .9em.

I didn't like how big the font was at 1 em

Then adjust the font setting in your browser to something you find
comfortable and pleasing. And once you have done that in your
browser, 1em or 100% will look perfect on your site.

so I made it smaller.
How do you suggest I make it smaller?

I suggest you not make it smaller in my browser.

Why does this matter?

It's bad structure to have a level 2 heading but no level 1 heading.
A logical structure starts at h1 for the main heading, h2 for sub
headings, h3 for sub sub headings, if you will, and so on.

I didn't want something as big as an h1.

Don't let presentation dictate structure or content. Use H1 for the
main heading of each page. Use css to determine how big they should
appear, all else being equal.

 

[Titus A Ducksass]

I've got a page done with all CSS with the exception of one table used
for a navigation menu. I have the navigation table in a <div> that is
positioned 175 pixels from the top. I have the content in a <div> also
that is also positioned 175 pixels from the top. In IE 6 it looks fine
and the text lines up with the top of the menu. However in Mozilla the
text appears below the menu by 10 or so pixels. Any Idea why? The url
is here:

http://www.goforthdesigns.com/test

Thanks for any help.

greg g.

If I use view text size largest, then I cannot see the menu due to the
bottom bar. If I use any other text size I cannot read it.

 

[Titus A Ducksass]

< http://www.alistapart.com/stories/taminglists/ >

Your link from your page to
http://ag.arizona.edu/hypermail/uaweb/uaweb799-700/0003.html does not
work.

 

[Brian]

Your link from your page to
http://ag.arizona.edu/hypermail/uaweb/uaweb799-700/0003.html does not
work.

Nice of you to point out, but it's not my page. :-/ I simply pointed
the op to a link about lists and css. If you're still feeling
generous with your time, you could contact the alistapart webmaster.
I'm sure he'd be quite grateful.