Register

If this is your first visit, please click the Sign Up now button to begin the process of creating your account so you can begin posting on our forums! The Sign Up process will only take up about a minute of two of your time.

Results 1 to 5 of 5
  1. #1
    Junior Member sinjix_media's Avatar
    Join Date
    Mar 2006
    Posts
    3
    Member #
    12950
    This may seem VERY trivial, but WHAT method to use to create rounded corners, whether it be JS, PURE CSS, CSS with images, or what is something people talk about a lot. Cross browser compatibility and what not is always an issue to talk about. What's faster, easier, whatever. I'm doing some research. I haven't made my decision yet.

    I want to be able to use a background gradient for a couple tables or divs(depending on what method i use)

    I've seen Spiffy corners, but am not sure if you can use background gradient images with it and it seems very limited as far as the radius goes(unless I'm missing something. If someone could show me an example of using Spiffy corners for a rounded corner radius of 15px it'd be greatly appreciated)

    I think if I was able to use spiffy and increase the radius by 15px rounded and use background gradients I'd be content.

  2.  

  3. #2
    Senior Member
    Join Date
    Jun 2005
    Location
    Atlanta, GA
    Posts
    4,146
    Member #
    10263
    Liked
    1 times
    I like using the method described in onion-skinned drop shadows at A List Apart for rounded corners, too. Regardless, do a search on A List Apart and you'll find a bunch of different rounded corner explanations.

    Also, on more recent versions of certain browsers (Safari and Firefox, and maybe Konqueror, too), you can use a variant of the CSS3 [minicode]border-radius[/minicode] property to do it with plain CSS. See this page for an example of those.

  4. #3
    Senior Member filburt1's Avatar
    Join Date
    Jul 2002
    Location
    Maryland, US
    Posts
    11,774
    Member #
    3
    Liked
    21 times
    The best and fastest method is to use CSS3 and its support for multiple background images per element. But, since nothing supports that yet, it varies.
    • If you know the width and height of the container at all times, a single background image.
    • If you don't, it varies depending on the markup you're using; if you can assume that certain tags will always appear in certain locations of the container, then you can add the appropriate background images to those tags.
    filburt1, Web Design Forums.net founder
    Site of the Month contest: submit your site or vote for the winner!

  5. #4
    Senior Member
    Join Date
    Jun 2005
    Location
    Atlanta, GA
    Posts
    4,146
    Member #
    10263
    Liked
    1 times
    I'd say the border-radius property in CSS3 beats the multiple backgrounds feature when we're talking about adjusting the border-radius :-)

  6. #5
    Senior Member filburt1's Avatar
    Join Date
    Jul 2002
    Location
    Maryland, US
    Posts
    11,774
    Member #
    3
    Liked
    21 times
    True, but even existing implementations are kinda messy (no antialiasing, background not contained by the border I believe, etc.)

    CSS3 is going to own when it is actually supported.
    filburt1, Web Design Forums.net founder
    Site of the Month contest: submit your site or vote for the winner!


Remove Ads

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •  
All times are GMT -6. The time now is 02:58 AM.
Powered by vBulletin® Version 4.2.3
Copyright © 2019 vBulletin Solutions, Inc. All rights reserved.
vBulletin Skin By: PurevB.com