Discuss: CSS Design: Creating Custom Corners & Borders Part II

by Søren Madsen

1 CSS3

Presumably this is the sort of effect CSS3’s border-radius property is supposed the achieve?

posted at 05:34 am on February 27, 2004 by Robin

2 A few tiny holes,yet, in IE6

I love these two articles and have, in fact, created a number of designs already based on Part I of “Custom Corners”. In Part II, especially, I still see a few tiny holes in IE6 (Windows XP Pro). The example link for Step 2.4 introduces gaps above the footers in each column — small ones in the left and right and a large one across the whole center column — but only after the user scrolls the page content. Resizing the browser, even by a pixel or two, makes the gaps disappear, but any scrolling brings them right back.

Is there any end to the madness?! (Kudos, by the way, to Madsen. This is a fine article. I think we’ll all be happier when these browser bugs are laid to rest.)

posted at 05:35 am on February 27, 2004 by David Stiller

3 Re: Tiny Holes

Even stranger. I get them too (Win2k/IE6) but only when I scroll using my mouse wheel. If I use IE’s scrollbar, everything is fine.

Those wacky IE developers!

posted at 06:23 am on February 27, 2004 by Seth

4 Customs Corners/Borders with only 1 image

As I’ve demonstrated before, in the 1st part, this is the 99% exact replica of Step2.3 testcase, but using only one image, instead of slicing into 5 images, which seems unnecessary.
http://phoenity.com/tests/custom_corners_one.html

posted at 06:37 am on February 27, 2004 by Lim Chee Aun

5 Slight problems in 1600x1200 res

The background image for the main body doesnt seem to repeat to the full width of the table in 1600×1200 using Firefox 0.8.

Cant quite see whats going on here though to fix it…

posted at 06:47 am on February 27, 2004 by Chris E Boy

6 RE: Customs Corners/Borders with only 1 image

RE: CSS3
—-
No. The keyword here is “custom” – not “round” :)

RE: Customs Corners/Borders with only 1 image
—-
Yes – your approach makes sense for smaller sections, but the slicing prepares the technique for sections with “infinite” length, as demonstrated in the center-column in step 2.4

RE: Slight problems in 1600×1200 res
—-
The background-image used for this article is only of a certain size, and therefore the layout looks like it’s “breaking” when viewed at very large resolutions. Use bigger images, or limit the possible size of the section.
And by the way – how dare you accuse me of using tables for this? (throws glove!)
;)

posted at 07:29 am on February 27, 2004 by S�ren Madsen

7 RE: Customs Corners/Borders with only 1 image

S�ren Madsen wrote:
Yes – your approach makes sense for smaller sections, but the slicing prepares the technique for sections with “infinite” length, as demonstrated in the center-column in step 2.4
—-
“infinite” length? I don’t understand. So far I know PNG/GIF are raster formats, not vectors, so they cannot get infinite width/height, right? Please correct me if I’m wrong.

posted at 07:34 am on February 27, 2004 by Lim Chee Aun