navbar 100% height

N

Nik Coughin

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?
 
B

brucie

in post: <
Nik Coughin said:

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

Nik Coughin

brucie said:
in post: <

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

kate.simpson

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
 
N

Nik Coughin

kate.simpson said:
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.
 

Ask a Question

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

You'll need to choose a username for the site, which only take a couple of moments. After that, you can post your question and our members will help you out.

Ask a Question

Members online

No members online now.

Forum statistics

Threads
473,743
Messages
2,569,478
Members
44,899
Latest member
RodneyMcAu

Latest Threads

Top