CSS help

[hargi]

Im wanting to make a nav bar that has rounded corners and each item has rounded corners on hover i can use boarder radius for this.

But also the items needs to have a reflection on them that fades out like a apple bar is there anyway of doing this (css reflections?? but this is not supported in many browsers?) or is it best to do images and roll overs?

 

[FabienO]

Either use CSS3 rounded corners only, or images only. Mixing the two would look weird on reflections in unsupported browsers.

Also to provide more clarity on what you're after, please provide a sample menu, what apple bar? Regarding the fade, you're probably looking for a JavaScript solution, or jQuery fadeOut();

It might be best for you to find a tutorial on how to achieve the menu you're trying to create rather than asking for a solution in here, it'll be easier and better for teaching you.

 

[hargi]

Sorry it was late last night when i posted, I don't think its that complicated i dont need the fade out.

I may have confused you with the apple bar, i ment like the task bar on an apple mac. but something like this http://www.flashdo.com/item/horizontal-reflection-menu-xml/476a but not in flash. With a horizontal reflection, and when mouse over just change the background to a orange colour.

 

[FabienO]

Easiest way to accomplish this is probably just use a sprite.

http://line25.com/tutorials/how-to-create-a-css-menu-using-image-sprites

Yours will look like:
--------------
Main Links
Reflection

Hover Main Links
Hover Reflection
-----------------

All one image.