After last week article on CSS trips and tricks I am adding some more here. I hope these tips are useful ones.
1. Remove links or textbox hightlight border
You can use the outline property to remove or hide a border highlighting the elements. Anish Blon wrote this in his most popular post one line CSS in March 2008.
a, input { outline:none; } to remove underline from link a:link { color: #0000FF; text-decoration: none; background: #FFFFFF;}/*normal links in the text*/
2. Hidden Text
You can hide the text by using the text-indent property as follows. We use hidden text when we’re using images to replace text but we want to make sure search engine can crawl the keyword.
a { text-indent:-999em; outline:none; width:200px; height:100px; }
3. CSS Transparency Setting for all browsers
you can use the following opacity hacks features to set transparency for different kinds of browsers
.transparent_class { filter:alpha(opacity=50); /* ie */ -moz-opacity:0.5; /* old mozilla browser like netscape */ -khtml-opacity: 0.5; /* for really really old safari */ opacity: 0.5; /* css standard, currently it works in most modern browsers like firefox, */ }
4. PNG Fix for IE6
Following hacks can be used to fix the PNG fix for IE6
.png_hack{ background-image: url(../img/image.png) !important; background-image: none; filter: none !important; filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='img/the_image.png'); }
Please have your say.
