[Solved] Background hover

[i9mickey]

Hey all,

Looking for a little help with my background rollover image. I hope my CSS in general looks pretty good, but I can’t for the life of me figure out how to make the size of the background image on the hover for the main menu images. This shouldn’t be that hard, but it’s eluding me. Basically I’d like the rollover image to be as high as the bar the menu is in (or close to it) and a little wider than the word it is highlighting. Looking forward to any input. Thanks!

http://www.i9creative.com/vh/

[i9mickey]

I am just not getting this technique. Can somebody help me figure out what I’m doing wrong.

It’s really hard to tell on this one, but you can see that the background image is confining itself to the width of the words in each

Code:

[i9mickey]

bump

Anybody out there?

[i9mickey]

Wow. I see how I confused you. Very sorry. I had taken out the images on the Vision Health site because I hadn’t been able to figure it out. Let’s just concentrate on that site as I’m sure I’ve just duplicated the problem on the other one.

http://www.i9creative.com/vh/

So I’ve put the images back in, and I’ve made the height of the nav bar the same size as the light blue bar, but I’m a little confused on what you mean by ul them to the right but center the text.

At any rate, the image is still confining itself to the width and height of the text within each li, so I’m still doing something wrong.

And thank you Ikthius for answering me. I appreciate it very much.

mickey

"ikthius" wrote:

main menu at top right of the page???

looking at the css it does not have any images…… is this correct?

I am kind of confused on what your asking for when there is not image there

looking at your css I would make the navbar the same size as the main lightblue bar, then ul them to the right but centre the text. then on hover change the background, which is the same size as the bar…..

so I hope you can see I am telling you to work on sizes, from the navbar down to a more specific element…..

on a side note……. why are you linking to 2 different pages? this defeats the purpose of asking a problem in one site. if you have the same problem on both sites, then you are doing something majorly wrong with your code or just copying it and changing colours

[i9mickey]

ikthius,

Thanks for all the help. That really got it. I had to adjust nudge it a bit, but it’s looking great. Looks like most of my issues had to do with height and padding. Also, I think maybe the relative positioning.

Anyways, I’m off and running. Thanks for the help!

[Author]

Posts