jnf555 Posted March 20, 2009 Share Posted March 20, 2009 i have been trying to hover over a background to change color, then revert back when moved away<html><head><style type="text/css">.a{background-color : yellow;}.a:"hover" {background-color : blue;}.a {width:300px;height300px}</style></head><body><div class="a">hover over to change background color</div></body></html>hi can anyone tell me why this dont workthanks jnf555 Link to comment Share on other sites More sharing options...
jeffman Posted March 20, 2009 Share Posted March 20, 2009 Delete the quotation marks around "hover" Link to comment Share on other sites More sharing options...
jnf555 Posted March 20, 2009 Author Share Posted March 20, 2009 i have retyped in another notepad still dont work <html><head><style type="text/css">.a {background-color:yellow;}.a:hover {background-color:red;}.a {width:300px;height300px}</style></head><body><div class="a">hover over to change background color</div></body></html>thanksjnf555 Link to comment Share on other sites More sharing options...
Guest FirefoxRocks Posted March 20, 2009 Share Posted March 20, 2009 You need to put the browser in standards mode in order to :hover to work on non-anchor(link) elements. Add a DTD to the top of your document like this:HTML5: <!DOCTYPE html><html>... blah blah blah HTML 4.01 Strict: <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"><html>... blah blah blah HTML 4.01 Transitional: <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"><html>... blah blah blah Without a DTD, the browser is in quirks mode and this will affect CSS behaviour. Also, it is height:300px; not height300px. Link to comment Share on other sites More sharing options...
jnf555 Posted March 20, 2009 Author Share Posted March 20, 2009 thats it thank you very mutchjnf555 Link to comment Share on other sites More sharing options...
Recommended Posts
Archived
This topic is now archived and is closed to further replies.