Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 5 of 5
  1. #1
    Regular Coder kyllle's Avatar
    Join Date
    Mar 2008
    Posts
    334
    Thanks
    85
    Thanked 2 Times in 2 Posts

    Curved corners question?

    Hi all,

    Just a general query, I created a curved box (just to test) and saved as a gif in order to keep the transparent corners of the image from appearing white (like .png) when displayed in ie6. When I view my image now though there is no curves but instead a very rough looking image round the corners??

    Can anyone explain the correct way to go about keeping the backgrounds of any images i want transparent and the curves etc nice and rounded?

  • #2
    New Coder
    Join Date
    Nov 2008
    Location
    Melbourne, Australia
    Posts
    69
    Thanks
    8
    Thanked 1 Time in 1 Post
    I have never actually tried making images with corners... but I have come across a video tutorial that might help.

    http://css-tricks.com/videos/css-tricks-video-24.php

  • #3
    The fat guy next door VIPStephan's Avatar
    Join Date
    Jan 2006
    Location
    Halle (Saale), Germany
    Posts
    8,700
    Thanks
    6
    Thanked 1,011 Times in 984 Posts
    A GIF image can only have 256 colors and index transparency, i. e. either full or no tranparency, much like an 8bit PNG. So if you export an image with partial transparency in GIF format all the partial transparency will be blended with the matte color to be fully opaque (non-transparent). This also means that if you have no matte color and partial transparency (for example due to anti-aliasing) the partially transparent pixels will become white by default, leaving a ragged edge.

    The backwards (i. e. IE6) compatible way is to use Adobe Fireworks to save the image as 8bit PNG with alpha transparency (that’s the only program I know that can do this) which will keep the anti-aliasing (partial transparency) in those browsers that support alpha transparency, and in IE 6 it will display the semi-transparent pixels as completely transparent, i. e. like a GIF/PNG with index transparency.

  • #4
    Supreme Master coder! abduraooft's Avatar
    Join Date
    Mar 2007
    Location
    N/A
    Posts
    14,861
    Thanks
    160
    Thanked 2,223 Times in 2,210 Posts
    Blog Entries
    1
    You'd need to use a normal png with some hacks for IE. Or an 8 bit transparent PNG
    See http://www.sitepoint.com/blogs/2007/...-clear-winner/ or http://mcapewell.wordpress.com/2006/...6-in-the-gimp/
    Last edited by abduraooft; 11-05-2008 at 03:58 PM.
    The Dream is not what you see in sleep; Dream is the thing which doesn't let you sleep. --(Dr. APJ. Abdul Kalam)

  • #5
    Senior Coder effpeetee's Avatar
    Join Date
    Feb 2007
    Location
    Clapham Junction - London SW
    Posts
    4,885
    Thanks
    228
    Thanked 204 Times in 203 Posts
    This site can help with the rounded corners.

    Frank
    Last edited by effpeetee; 11-06-2008 at 04:43 PM.
    * Sources (updated: 21.11.2012.
    Using Windows 8 Professional. 64bit with HP Photosmart 5510 printer Very useful site here.

  • Users who have thanked effpeetee for this post:

    kyllle (11-19-2008)


  •  

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •