navbar 100% height

Discussion in 'HTML' started by Nik Coughin, Jul 9, 2004.

  1. Nik Coughin

    Nik Coughin Guest

    Hi,

    I am trying to make a navbar on the left side of my page which has a minimum
    height of 100% of the window, a graphic at the top,
    a graphic at the bottom and a graphic in the middle which is stretched to
    fill the space. The navigation links go over the middle graphic.

    This is what I have so far:
    http://www.nrkn.com/crew/

    It's OK, but I don't like the way that
    a) the bottom graphic covers the links if you resize the window too much
    b) It all gets a little kooky when you resize the window anyway because I'm
    positioning the bottom graphic against the bottom of the viewport... not
    such a great idea I realise. I'd rather the bottom graphic was positioned
    in relation to the bottom of the entire page's content, not the bottom of
    the viewport.

    Basically what I want is a left navbar which fills 100% of the height if the
    content is less than 100% of the height or expands if the content is more
    than 100%, with an image at the top and bottom and the stretched image in
    the middle. Any links to existing layouts like this or just hints or tips
    in general?

    --
    -=-=-=-=-=-=-=-=-=-=-=-
    http://www.nrkn.com/
    -=-=-=-=-=-=-=-=-=-=-=-
    Nik Coughin, Jul 9, 2004
    #1
    1. Advertising

  2. Nik Coughin

    brucie Guest

    in post: <news:bmpHc.8942$>
    Nik Coughin <nrkn!no-spam!@woosh.co.nz> said:

    > http://www.nrkn.com/crew/


    how does this grab you: http://moreshit.usenetshit.info/crew/index.shit

    rather than the window height it uses the content area height for the
    menu height. for small amounts of content or extra wide windows i'm
    using min-height:500px; so the menu doesn't squish up.

    min-height isn't supported by IE so perhaps you'd be better off sticking
    in a 1x1px transparent image resized with html large enough to prevent
    the menu squishing for pages with little content.


    --
    b r u c i e
    brucie, Jul 9, 2004
    #2
    1. Advertising

  3. Nik Coughin

    Nik Coughin Guest

    brucie wrote:
    > in post: <news:bmpHc.8942$>
    > Nik Coughin <nrkn!no-spam!@woosh.co.nz> said:
    >
    >> http://www.nrkn.com/crew/

    >
    > how does this grab you:
    > http://moreshit.usenetshit.info/crew/index.shit
    >
    > rather than the window height it uses the content area height for the
    > menu height. for small amounts of content or extra wide windows i'm
    > using min-height:500px; so the menu doesn't squish up.
    >
    > min-height isn't supported by IE so perhaps you'd be better off
    > sticking in a 1x1px transparent image resized with html large enough
    > to prevent the menu squishing for pages with little content.


    Thanks Brucie, that was interesting. By the time I'd read it I'd abandoned
    that layout anyway, but still good to pick up a few tricks, cheers.
    Nik Coughin, Jul 13, 2004
    #3
  4. Nik Coughin

    brucie Guest

    in post: <news:4zMIc.1906$>
    "kate.simpson" <> said:

    > Hello.


    hello

    please don't toppost, i know where you live.

    How am I supposed to post my replies in a newsgroup?:
    http://allmyfaqs.com/faq.pl?How_to_post

    --
    b r u c i e
    brucie, Jul 13, 2004
    #4
  5. Nik Coughin

    kate.simpson Guest

    Nik,
    Hello.
    Well, I like the navbar a lot, but there's no way that you can stretch the
    image without it ruining the image (if I'm understanding you correctly).
    Why not use this as an opportunity to, put the image inside of a black
    table, for example?
    But, if I'm not on the right track, please let me know.
    My best,
    Ginae!
    http://www.ginae.us


    "Nik Coughin" <nrkn!no-spam!@woosh.co.nz> wrote in message
    news:bmpHc.8942$...
    > Hi,
    >
    > I am trying to make a navbar on the left side of my page which has a

    minimum
    > height of 100% of the window, a graphic at the top,
    > a graphic at the bottom and a graphic in the middle which is stretched to
    > fill the space. The navigation links go over the middle graphic.
    >
    > This is what I have so far:
    > http://www.nrkn.com/crew/
    >
    > It's OK, but I don't like the way that
    > a) the bottom graphic covers the links if you resize the window too much
    > b) It all gets a little kooky when you resize the window anyway because

    I'm
    > positioning the bottom graphic against the bottom of the viewport... not
    > such a great idea I realise. I'd rather the bottom graphic was positioned
    > in relation to the bottom of the entire page's content, not the bottom of
    > the viewport.
    >
    > Basically what I want is a left navbar which fills 100% of the height if

    the
    > content is less than 100% of the height or expands if the content is more
    > than 100%, with an image at the top and bottom and the stretched image in
    > the middle. Any links to existing layouts like this or just hints or tips
    > in general?
    >
    > --
    > -=-=-=-=-=-=-=-=-=-=-=-
    > http://www.nrkn.com/
    > -=-=-=-=-=-=-=-=-=-=-=-
    >
    >
    >
    kate.simpson, Jul 13, 2004
    #5
  6. Nik Coughin

    Nik Coughin Guest

    kate.simpson wrote:
    > Nik,
    > Hello.
    > Well, I like the navbar a lot, but there's no way that you can
    > stretch the image without it ruining the image (if I'm understanding
    > you correctly). Why not use this as an opportunity to, put the image
    > inside of a black table, for example?
    > But, if I'm not on the right track, please let me know.
    > My best,
    > Ginae!
    > http://www.ginae.us
    >

    Hi Kate,

    It is possible, as I am only stretching (actually, I am tiling) the middle
    section of the navbar, and even then only vertically. The top and bottom
    parts are being left as they are.

    --
    -=-=-=-=-=-=-=-=-=-=-=-
    http://www.nrkn.com/
    -=-=-=-=-=-=-=-=-=-=-=-
    Nik Coughin, Jul 14, 2004
    #6
    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. Not4u
    Replies:
    9
    Views:
    1,028
    Not4u
    Feb 27, 2004
  2. Replies:
    8
    Views:
    6,667
    Neredbojias
    Dec 9, 2005
  3. Bernd Meier
    Replies:
    6
    Views:
    502
    GTalbot
    Jan 14, 2008
  4. fred
    Replies:
    3
    Views:
    261
    Zifud
    Mar 17, 2005
  5. Replies:
    5
    Views:
    869
Loading...

Share This Page