pranshu82202 Posted August 23, 2011 Share Posted August 23, 2011 I am using mozilla firefox. i want to make a division transparent so i used the code <style type="text/css"> #mydiv { opacity: .2; } </style> It is making the division almost transparent but the text which i hav written turned transparent also... I also tried to put text in another division and setted it opacity to 1 but that too was not a success .. Basically i want to make background a little transparent but not the text.. Tell me what should i do... -pranshu.a.11@gmail.com Quote Link to comment https://forums.phpfreaks.com/topic/245488-opacity/ Share on other sites More sharing options...
JasonLewis Posted August 23, 2011 Share Posted August 23, 2011 Yeah pain in the ass that isn't it. Depending on your needs you can use rgba. Example: #mydiv { background: rgba(0, 0, 0, 0.5); } Quote Link to comment https://forums.phpfreaks.com/topic/245488-opacity/#findComment-1260969 Share on other sites More sharing options...
Frank P Posted August 23, 2011 Share Posted August 23, 2011 #mydiv { background: rgba(0, 0, 0, 0.5); } High-tech, but is that supported by older browsers (IE6/7, FF3.x and Chrome8+)? Quote Link to comment https://forums.phpfreaks.com/topic/245488-opacity/#findComment-1261000 Share on other sites More sharing options...
cssfreakie Posted August 23, 2011 Share Posted August 23, 2011 in case you want to have a fool proof crossbrowser solution, use a 1x1 .png in the color and transparancy you like and set that as background color on repeat Quote Link to comment https://forums.phpfreaks.com/topic/245488-opacity/#findComment-1261012 Share on other sites More sharing options...
pranshu82202 Posted August 23, 2011 Author Share Posted August 23, 2011 FRANK P yes it is supported by all versions of google chrome and safari, mozilla 3.0+ and IE9 Quote Link to comment https://forums.phpfreaks.com/topic/245488-opacity/#findComment-1261019 Share on other sites More sharing options...
cssfreakie Posted August 24, 2011 Share Posted August 24, 2011 FRANK P yes it is supported by all versions of google chrome and safari, mozilla 3.0+ and IE9 So atleast 30% of your audience can't enjoy it Quote Link to comment https://forums.phpfreaks.com/topic/245488-opacity/#findComment-1261285 Share on other sites More sharing options...
Frank P Posted August 24, 2011 Share Posted August 24, 2011 So atleast 30% of your audience can't enjoy it Exactly. That's why I, too, would suggest to make a transparent image in Photoshop. Easy as 1,2,3, if you have a bit of a recent version. Quote Link to comment https://forums.phpfreaks.com/topic/245488-opacity/#findComment-1261292 Share on other sites More sharing options...
JasonLewis Posted August 24, 2011 Share Posted August 24, 2011 How about screw those guys on lame ass old browsers. Update or gtfo. Unless of course you really really really need to ensure it has the opacity in an older browser. If not, just set a lighter gray as the background color then set the background to the rgba value. Degrades gracefully enough and those who aren't tadling around in the year 2000 can enjoy your nice div. I honestly prefer anything that uses less http requests. Quote Link to comment https://forums.phpfreaks.com/topic/245488-opacity/#findComment-1261432 Share on other sites More sharing options...
Frank P Posted August 24, 2011 Share Posted August 24, 2011 How about screw those guys on lame ass old browsers. Update or gtfo. I don't think my clients will agree with that... I honestly prefer anything that uses less http requests. HTTP requests hardly make a site render slowly. Large images, moving images, poor server capacity and bottle necks in the connection between the server and the user's computer do. This whole request issue is exaggerated tremendously. Quote Link to comment https://forums.phpfreaks.com/topic/245488-opacity/#findComment-1261532 Share on other sites More sharing options...
JasonLewis Posted August 24, 2011 Share Posted August 24, 2011 How about screw those guys on lame ass old browsers. Update or gtfo. I don't think my clients will agree with that... That wasn't meant to be taken 100% seriously. Like I said, unless you need it to work in older browsers I'd use the rgba method. I still prefer the absolute minimum http requests. Quote Link to comment https://forums.phpfreaks.com/topic/245488-opacity/#findComment-1261559 Share on other sites More sharing options...
cssfreakie Posted August 24, 2011 Share Posted August 24, 2011 Jaysonic is totally right! So use conditional comments or something to target older browsers and apply new techniques for the new ones. HTTP requests hardly make a site render slowly. Large images, moving images, poor server capacity and bottle necks in the connection between the server and the user's computer do. This whole request issue is exaggerated tremendously. have you got an idea what the impact is of using single images where you don't have to in for instance the following case. I don't think you do, because the impact is huge! anyway lets keep it on topic Quote Link to comment https://forums.phpfreaks.com/topic/245488-opacity/#findComment-1261584 Share on other sites More sharing options...
Frank P Posted August 24, 2011 Share Posted August 24, 2011 I don't think you do, because the impact is huge! I never said one shouldn't use the sprite technique if possible. And in this case it isn't. Quote Link to comment https://forums.phpfreaks.com/topic/245488-opacity/#findComment-1261626 Share on other sites More sharing options...
Recommended Posts
Join the conversation
You can post now and register later. If you have an account, sign in now to post with your account.