Posts Tagged CSS
More PNG transparency notes
Posted by admin in Web design & development on May 10, 2009
Via thinkvitamin and tipster: a couple of notes that may resolve a couple of outstanding issues I’ve had with PNG24 transparency use…
Set width and height for the element/s containing the transparent background image [...] (also, bear in mind that the background images can no longer be tiled or positioned via ‘background-position’)
Applyposition: relative;to any contained links to ensure functionality
The first point means I’ll probably not bother trying to tile a drop-shadow background image to a variable length column again. Time to switch to progressive enhancement with Photoshop CS4/Fireworks/other tools’ ability to stuff alpha transparency into regular PNG8 files.
The second point is probably the better answer to my last PNG problem post.
Main post about how to work with PNG24 alpha transparency and IE6 …
IE6 link bug over PNG
Posted by admin in Web design & development on February 22, 2009
One day I awoke brightly, but to my surprise…
I’ve been so excited to be able to use full alpha transparency PNGs and getting them to play nice in IE6. Today I’ve found another PNG/IE6 issue. It seems that in some cases IE6 doesn’t like to have links in an element that is child of one with a background PNG to which filter:progid:DXImageTransform.Microsoft.AlphaImageLoader is applied.
The solution (in my case) was very simple: just needed to close the div for the background and add another for the links. Now the links just appear to be contained by the background.
CSS trickery: eat my heart out.
Disappearing fixed div in IE7
Posted by admin in Web design & development on February 17, 2009
Who’d have thought – eh?
Here’s a bug I came across while working on the updated Solutions Overseas website. Not used position:fixed; in anger before. The “Enquire Now” button there is fixed. Except in IE7 though. Looked around and it’s apparently caused by a floated div next to a postion: fixed div (next to/child of parent etc… )
Simple fix – add another div around or between those two scrapping trouble makers.