Comments on: Spanky Corners 1.0 : Rounded Corners + Clean HTML + No JavaScript

By: Osiris

Osiris — Sat, 07 Mar 2009 21:32:35 +0000

Excellent generator you got here for rounder corners!!

I’ve used your code when generated, but changed the corner graphics and used PNG instead of GIF, as it produces much better quality rounded graphics.

Still, excellent resource

By: hellhound

hellhound — Mon, 07 Jul 2008 15:32:24 +0000

this is not working in ie8 beta, missing top left corner,

By: Tim

Tim — Mon, 16 Apr 2007 14:44:59 +0000

Why do you not use a child selector instead of a descendant and then overriding for 2+ descendants?

By: AlexW

AlexW — Wed, 08 Nov 2006 23:19:40 +0000

Thanks harl,

Some interesting stuff there. I agree PNG are a better option in general. As much as anything, we wanted to provide some graphics that matched the CSS to make it easier to understand when you downloaded the zip. The graphics are quite usable, but being auto-generated, I tend to remake them get them just a little bit slicker.

By: harl

harl — Wed, 08 Nov 2006 05:25:26 +0000

just a hint, but from my experiences with GIF images.. they are not lossless at all, despite there are descriptions on the net which tell otherwise. the way GIF saves ‘hotspotted’(focused/assembled) information by reducing the images colour depth to 8 bit, mostly also reduces overall colour quality. at least that’s what (most) programs do when converting/compressing images. even with raw data and high quality settings it still gets dithered. that’s GIF.
personally, i don’t see and good in that. GIF only works well if the colour depth of the original image doesn’t exceed some value between 8 and 16 bit, depending on how many different colours the image actually includes and which of them are obviously distinguishable by the human eye.

seen that way, at least some of the GIFs generated for ’spanky corners’ are lossy as well, so i would advise against using GIF.

if you’re unsure, try some random colours yourself (ex. my current favourite background: #0f1528 and foreground: #1a2237), setting the corner’s edge length to 60 (so it’s big enough to make the difference more apparent to the eye) and you’ll see the whole 60×60 corner having different colours than both the BODY’s and the DIV’s background.

using PNG instead would solve that problem (it’s lossless and supports transparency as well). corners up to 20 or maybe 30 pixels edge length could even be BMP, as long as you don’t plan to add transparency (or antialiasing) to them.

By: AlexW

AlexW — Tue, 26 Sep 2006 00:23:17 +0000

Tony, I must admit it’s not something I’ve thought about before, but yes, I guess it’s possible that it could be an issue. I know you said you’re not a CSS hacker, but you do have a separate IE stylesheet, so I would guess that tweaking the height in that would adjust the fit.

By: Tegou

Tegou — Mon, 25 Sep 2006 23:29:46 +0000

No problems with lowercase letters on my system with IE 6, using h1 and h2 tags. I did remove rounded-ie.css from my page, and I set the height to Auto. My sample file has 5 rounded corner structures on the page 1 large one and four smaller, equally sized boxes. I tried several letters (just in case it was that specific) and haven’t noticed a problem. I even tested out IE 6 text size from smallest to largest, without a problem.

FWIW,
TeGou

By: Tony H

Tony H — Mon, 25 Sep 2006 17:52:14 +0000

In IE6 at least, there is a horizontal bar in the top left corner if you start the header with a lower case character.

With many designers using lower case chars for site names/logos, this could be problematic?

I’m not a css hacker so don’t really have a fix – but I have just run into the problem…

tony

By: GregM

GregM — Thu, 07 Sep 2006 23:56:33 +0000

Alex, I figured it out. I had your code mixed in with mine and had missed some conflicting code in one of my own header properties that was causing the weird behavior. Thanks for the reply though.

By: AlexW

AlexW — Wed, 06 Sep 2006 07:21:56 +0000

Greg, can you put it online where we can get a look at it?