How to copy a CSS style from a website for re-use

I am frustrated. I have one website where my drop-down CSS menu works and another where it doesn't.

Their stylesheets differ wildly and, although I have tried to manually copy the menu styles from one to the other, but with no success.

Is their any tool which will let me (like FireDebug) click on a page section (the menu) and then copy the rules which affect that section - ignoring those which are hidden by other rules - so that I can post them开发者_运维百科 into the second site's stylesheet.

It seems that rather than having multiple styles affecting the menu and trying to sort out which have precedence, I'd like to have some software sort it out and generate a single combined rule ... if you see what I mean.

Both FireBug and the inbuilt Chrome Dev Tools show you what styles are being utilised by the selected element. I don't work with FireBug much, but I know the Chrome Dev Tools will cross out overrided styles and even show default user-stylesheets where applicable. It's also kind of nifty when inline styles are applied, eg for a table the "frame" attribute, as it converts these to CSS and displays it as part of the styling ;)

Sounds like you've got problems with accidental inheritance. Try to make sure your CSS selectors are only referencing the elements you want to style. Otherwise things get messy, and stuff like this happens.