Newbee. The best way to have rounded corners in CSS

Discussion in 'HTML' started by Bikseo, Sep 7, 2008.

  1. Bikseo

    Bikseo Guest

    Bikseo, Sep 7, 2008
    #1
    1. Advertising

  2. Bikseo

    Ari Heino Guest

    Bikseo kirjoitti:
    > I have tried to follow the way that this guy do it, but cant get it working
    > myself. I have only been testing it in explorer 7.
    >
    > http://green-beast.com/experiments/css_smart_corners.php
    >
    > Anyone who can get it to work.
    >
    > Is there a better way to do rounded corners?
    >
    >


    One solution, although it has severe symptoms of "divitis". Workaround
    to use multiple background images.

    css:

    #roundedBox {
    background: #669900 url(tl.png) no-repeat;
    width: 24em;
    margin: auto;
    }

    #roundedBox div {
    background: transparent url(tr.png) top right no-repeat;
    }

    #roundedBox div div {
    background: transparent url(bl.png) bottom left no-repeat;
    }

    #roundedBox div div div {
    background: transparent url(br.png) bottom right no-repeat;
    padding: 30px;
    }

    html:

    <div id="roundedBox"><div><div><div>
    <p>Your content here.</p>
    </div></div></div></div>

    --
    Ari
    http://users.utu.fi/athein/
     
    Ari Heino, Sep 7, 2008
    #2
    1. Advertising

  3. Bikseo

    Nico Schuyt Guest

    Nico Schuyt, Sep 8, 2008
    #3
  4. Bikseo

    Nico Schuyt Guest

    Nico Schuyt, Sep 8, 2008
    #4
    1. Advertising

Want to reply to this thread or ask your own question?

It takes just 2 minutes to sign up (and it's free!). Just click the sign up button to choose a username and then you can ask your own questions on the forum.
Similar Threads
  1. Konrad

    rounded corners in data grid

    Konrad, Aug 30, 2003, in forum: ASP .Net
    Replies:
    2
    Views:
    824
    Ken Schaefer
    Aug 30, 2003
  2. Francisco J. Jurado

    Rounded corners in menu Table and Bottons

    Francisco J. Jurado, May 31, 2004, in forum: ASP .Net
    Replies:
    3
    Views:
    599
    John Timney \(Microsoft MVP\)
    May 31, 2004
  3. Fluxcore

    CSS and rounded corners

    Fluxcore, Dec 2, 2003, in forum: HTML
    Replies:
    2
    Views:
    415
    Richard
    Dec 3, 2003
  4. Jeff Bowman

    IE Bug w/CSS Rounded Corners

    Jeff Bowman, Dec 15, 2006, in forum: HTML
    Replies:
    1
    Views:
    390
    Jeff Bowman
    Dec 16, 2006
  5. Replies:
    2
    Views:
    1,056
    Nik Coughlin
    Mar 11, 2007
Loading...

Share This Page