O CSS Masters, rounded corners so close

[berkeleyB]

I have given an earnest try, following the directions found at
<http://www.w3.org/Style/Examples/007/roundshadow.htm l>

The result is Close, so close! But not working...
<http://ewasteinsights. info/survey/serviceForm.htm l>

perhaps a small bit of light shed on my looming darkness??

[berkeleyB]

In article <ne************ **************@ newsclstr02.new s.prodigy.com>,
berkeleyB <ne****@screenl ightDOT.com> wrote:

I have given an earnest try, following the directions found at
<http://www.w3.org/Style/Examples/007/roundshadow.htm l>

The result is Close, so close! But not working...
<http://ewasteinsights. info/survey/serviceForm.htm l>

perhaps a small bit of light shed on my looming darkness??

UPDATE - I clued in to a couple of details: the middle repeater element
*does* have to reach all the way across to the left edge; I took away a
surrounding style and simplified the html on the page; and its better to
have the slices be exactly on the edges (even though it is a transparent
background image in Fireworks)

SO I am left with a simpler execution with slightly different
problems. That is the images specified in myStyle::before { content: }
and myStyle::after{ content: } are both aligned to the very left of the
page, but the center repeater, myStyle::before { background: } and
myStyle::after{ background: } are indented about 6 pixels. SO the visual
is that the top and bottom left corners are broken away to the left by 6
pixels, while everything else is dandy.

the whole style declaration is below. Advice welcome!!
..addInfo::befo re { display: block; line-height: 0;
background: url(CaptionBox_ r2_c3.gif) top right no-repeat;
content: url(CaptionBox_ r2_c2.gif) }

..addInfo::afte r { display: block; line-height: 0;
background: url(CaptionBox_ r4_c3.gif) bottom right no-repeat;
content: url(CaptionBox_ r4_c2.gif) }

..addInfo { font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: medium; font-style: normal; font-weight: normal; color:
#000000; vertical-align: default; background-color: #F5F5F5;
border-color: #FFFFFF; max-width: 600px; background:
url(CaptionBox_ r3_c2.gif) right repeat-y }

[josh]

I can't help you with your problem....but If you don't mind javascript,
there is another method to getting rounded corners that I like alot:
http://pro.html.it/print_articolo.as...99/stampa.html

[Spartanicus]

berkeleyB <ne****@screenl ightDOT.com> wrote:

[Apparently about "rounded corners"]

I have given an earnest try, following the directions found at
<http://www.w3.org/Style/Examples/007/roundshadow.htm l>

W3C is not a good place to look for practical authoring examples. There
are probably much better examples on the net
http://www.google.com/search?q=css+round+borders

--
Spartanicus

[google]

berkeleyB wrote:

I have given an earnest try, following the directions found at
<http://www.w3.org/Style/Examples/007/roundshadow.htm l>
The result is Close, so close! But not working...
<http://ewasteinsights. info/survey/serviceForm.htm l>
perhaps a small bit of light shed on my looming darkness??

Hello,

I have a small program I wrote that produces some good rounded corner
code, if you want to take a look at a working example:

http://www.impliedbydesign.com/rocki...d-corners.html

You can easily adjust the images for the look you're going for.

Chris S.

Free Web Design Tools
http://www.impliedbydesign.com/free-...e-scripts.html