At 09:37 AM 7/18/2006, Portman wrote: >I am changing a JavaScript menu to CSS for the mouseover and wanted to >make it look like it was still a button that depresses on mouseover. I >tried fiddling with adding a border on mouseover (the same color as the >background) but it moves all the links, not just the one I am hovering >over. Any ideas/help would be much appreciated.
Generally speaking, the trick is to not add any new dimension to your objects on hover but to change the appearance of already-existing properties so that the overall dimensions of each menu item remain the same. For example: - change border color. - swap dimensions of thin left & thick right borders so that the whole block retains its width. - swap margin or padding for border. - swap background image on hover (CSS background properties will never affect the size & shape of the block). By the way, are you sure you want to make the buttons look depressed when you mouse over them? That doesn't really mimic any real-world object behavior, which is what web page buttons set out originally to do. If a button presses in when you hover over it, does that mean it doesn't react further when you click it? That seems like a user interface glitch to me. I'd consider a three-state menu in which button faces gleam or brighten on hover and depress when clicked. Regards, Paul ______________________________________________________________________ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
