fix css image menu

views:

answers:

fix css image menu

Hi,

I am trying to create a css based image rollover navigation bar. For some reason, I can not get the images in the right place. I was hoping someone could help.

You can find the code and images here: http://garretwais.com/Freelance/9-3-2010/home.html

Thanks,

Garret

You did not position the navigation bar hover areas right, maybe add some margin to them?

SHiNKiROU 2010-09-06 02:38:03

yeah that is the problem that I cant seem to fix, im not sure why the hover areas drop down like that. and Im not sure by adding margins, it would fix that problem...but i could be wrong. I will try.

Garyoto 2010-09-06 02:50:25

When I used Developer Tools to inspect the navigation, I found the hover areas are off the place

SHiNKiROU 2010-09-06 04:34:32

yes you are correct, spacing of the hidden text is not perfect right now. I am adjusting it as i type, but even if I space it correctly now, I am still stuck with, how do I adjust the image rollover properly?

Garyoto 2010-09-06 06:18:23

One of the first things that sticks out is that you are trying to use postion:absolute, but you don't have the position of the parent container defined. In order for absolute positioning to work, the parent element must have a position other than the default static position.

You also seem to be using display:block in a bunch of places where it is either redunant (LI are already block elements) or not needed since you are displaying the menu items inline. Using diplay:block inserts a line break after the element you are displaying as a block.

Brent Friar 2010-09-06 05:25:06

ok, I will go with position:relative; for the parent container. and will take out all redundant display properties. thank you for the suggestions. do you think, adjusting the image position is the correct answer to fixing the where the rollover image is popping up?

Garyoto 2010-09-06 06:04:49

Once you get the absolute positioning sorted out so it works properly it should be easy to position each of the roll overs. It looks like you need them to pop up in the same place since the image seems to account for the tab location. Once those images are lined up, you'll be able to mess with the link spacing to it lined up exactly.

Brent Friar 2010-09-06 13:46:52

Great! thanks for you help.

Garyoto 2010-09-07 15:49:26

ansaurus

tags:

views:

answers:

fix css image menu

related questions