|
Irony wakeup call: Since writing this method that creates round corners on tables using graphics, I have written what I regard as a much better method, using pure CSS, no graphics, no tables, no JavaScript. I recommend the new method (described here), and this page remains only for historical purposes. By the way, the colored tables on this page represent the old method, but they are wrapped in a container using the new method.
You can make round table corners in an HTML page using a variety of methods, but each method has drawbacks:
- A pure-CSS (Cascading Style Sheet) method, or some combination of CSS and JavaScript like Nifty Corners, eliminates the need for any graphic images, but in exchange, these methods are quite complicated and don't work with all browsers.
- Using little graphic images at each table corner is the simplest and most compatible method, but you first have to create those little graphic images, with the desired radius and color, for each different table style.
I personally think the second approach is better, because it doesn't need to know what browser your visitor is using. It also adheres to the time-honored KISS (Keep It Simple, Stupid) principle. So I decided to write a Ruby script that generates the little corner graphic images.
This method works best in Linux, where there is a rich environment of utilities to help you develop Web content, but it can also be made to work in Windows, with some extra effort to overcome the deep hostility to personal creativity that is built into that operating system.
This method needs a Ruby interpreter, also it needs the ImageMagick graphic tool library. Both of these are available on a typical Linux installation by default. For Windows, you will most likely have to download and install both of them.
NOTE: This technique is only necessary because HTML and CSS are still in a fairly primitive state. A round-cornered table feature is expected to be included in a future CSS version.
| |