CSS-P issue

Discussion in 'HTML' started by Greg, Jul 22, 2003.

  1. Greg

    Greg Guest

    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.
    Greg, Jul 22, 2003
    #1
    1. Advertising

  2. Greg

    Brian Guest

    Greg wrote:
    > 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.

    --
    Brian
    follow the directions in my address to email me
    Brian, Jul 22, 2003
    #2
    1. Advertising

  3. Greg

    Guest

    > 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-
    , Jul 22, 2003
    #3
  4. Greg

    PeterMcC Guest

    wrote:
    >> 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?


    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.

    >> 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.


    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%

    --
    PeterMcC
    If you feel that any of the above is incorrect,
    inappropriate or offensive in any way,
    please ignore it and accept my apologies.
    PeterMcC, Jul 22, 2003
    #4
  5. Greg

    Brian Guest

    wrote:
    >> 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


    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.

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

    >
    > 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.

    --
    Brian
    follow the directions in my address to email me
    Brian, Jul 22, 2003
    #5
  6. On Tue, 22 Jul 2003 00:07:34 GMT, Greg <>
    wrote:

    >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, Jul 22, 2003
    #6
  7. Titus A Ducksass, Jul 22, 2003
    #7
  8. Greg

    Brian Guest

    Titus A Ducksass wrote:
    > On Tue, 22 Jul 2003 02:11:07 GMT, Brian
    > <-remove-this-part> wrote:
    >
    >>< 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. :)


    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.

    --
    Brian
    follow the directions in my address to email me
    Brian, Jul 22, 2003
    #8
    1. Advertising

Want to reply to this thread or ask your own question?

It takes just 2 minutes to sign up (and it's free!). Just click the sign up button to choose a username and then you can ask your own questions on the forum.
Similar Threads
  1. Eric
    Replies:
    4
    Views:
    699
    clintonG
    Dec 24, 2004
  2. tom watson

    print.css and screen.css

    tom watson, Sep 9, 2003, in forum: HTML
    Replies:
    1
    Views:
    452
    Jukka K. Korpela
    Sep 9, 2003
  3. Joshua Beall
    Replies:
    1
    Views:
    414
    Bertilo Wennergren
    Dec 10, 2003
  4. Noozer
    Replies:
    10
    Views:
    2,040
    Mitja
    Oct 13, 2004
  5. Titus A Ducksass - AKA broken-record
    Replies:
    6
    Views:
    641
    Titus A Ducksass - AKA broken-record
    Nov 15, 2004
Loading...

Share This Page