Hello, I working on css gradients because I want the gradient to automatically scale according to content.
I used IE filters to make it work in IE browsers (no problems in IE) and a separate css declarations (class) to make it work in firefox using png background But in firefox, the png gradient will work only in the first div, it wont work in the succeeding div(s), which basically has the same class. Is this a specificity problem? below is the code ============ <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd";> <html xmlns="http://www.w3.org/1999/xhtml"; xml:lang="en" lang="en"> <head> <title>Gradient</title> <!--[if IE 7]> <style type="text/css"> .box { border: solid 1px #113C9F; height:1em; } </style> <![endif]--> <style type="text/css"> a:link{color:white; text-decoration:underline;} .pairingBG { background:#345dd9 url(grad_white.png) repeat-x fixed top; } * .pairingBG { FILTER:progid:DXImageTransform.Microsoft.Gradient(GradientType=0, StartColorStr='#86A5fe', EndColorStr='#345dd9'); PADDING-BOTTOM: 0px; COLOR: #ffffff; PADDING-TOP: 0px; BACKGROUND-COLOR: #345dd9; border-top: solid 1px #113C9F; border-left: solid 1px #113C9F; border-right: solid 1px #113C9F; border-bottom: none; width: 177px; } #boxme{ width: 177px; height: 30px; padding:100px 0 0 50px; } #box { height:auto; } </style> </head> <body> <div id="boxme" class="pairingBG"> this is text</div> <div id="box" class="pairingBG"> this is text too which can be extended if there is much content to hold </div> <div class="pairingBG"> this is text</div> </body> </html> *********************************************** Rey Mendoza,Jr. http://reymendoza.com " A man will reap exactly what he sows" *********************************************** ______________________________________________________________________ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
