Previous Message
Next Message

Rounded corners

Sent by francky on 30 June 2006 12:12


Eoin Maguire wrote:

>Hi,
>
>    I'm trying to get rounded corners working through CSS, I've read lots on
>the net about how it's possible and have in the past implemented some
>systems of my own that worked out really well. 
>
>However, I think what I'm attempting now isn't possible with CSS, or at
>least not practical if it's to be used many times throughout a site (as in
>the code would be unwieldy).
>
>Basically I'm trying to have an outline border that runs right around a DIV,
>as well as a curved gradient section at the top. Basically like the boxes on
>this page:
>
>http://plone.org/documentation/tutorial/rounded-corners-in-css/tutorial-all-
>pages
>
>But instead of a solid colour at the top, I want a gradient.
>Is this possible or practical?
>
>Thanks!
>
Hi Eoin,
I think it is good possible, like allmost everything is possible with 
css. :-) [1]
It is less easy, if the gradient has to scroll over a not unicolor 
background, but it stays possible (with IE-hacks)!
The other question: is it practical? ... Depends on your definition of 
'practical' ;-)
As far as I know, there are 2 basic methods:
    1. put some extra div's in the html
    2. let a javascript do that automatically. [2]
The first one is not practical, if you don't like to copy/paste a lot 
(and/or if you want the html to be as clean as possible). [3]
The second one is not practical, if you like that visitors with 
javascript turned off can see the rounded corners as well.

Greetings,
francky

Oh, just saw the spanky-corners, no extra div's and no js; but not 
giving totally freedom to style the elements inside the box.

[1] My corners corner 
<http://home.tiscali.nl/developerscorner/liquidcorners/liquidcorners.htm>.
[2] Somewhere on the Wiki-corner page 
<http://css-discuss.incutio.com/?page=RoundedCorners>.
[3] If you have only fixed width boxes, it will be less extra.


______________________________________________________________________
css-discuss [EMAIL-REMOVED]]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Previous Message
Next Message

Possibly related: