Horizontal alignment and table width
This table should have a width of 300px, and the cells should be
aligned as stated:
In this table (again 300px), all the "." characters should be lined
up, in the cells with numbers. These cells can be anywhere in the column.
Cells without a "." should have their last number right before where the
dot would be:
| left |
| center |
| right |
| left |
| 57351 |
| 3.783 |
| 3783.21 |
| 16384.4 |
| .4096 |
This table should (although the spec doesn't say so) be wide enough
for both numbers to be "."-aligned.
Here are some more tests of character alignment. The next three tables
should be aligned entirely on ñ (n with tilde), ◦ (circular
bullet), and ∈ (element of).
| mañana |
| enganñar |
| Señor Smith |
| A line with a ◦ in it. |
| ◦ another such line |
| And another bullet: ◦ |
| x ∈ integers |
| 1, 2, 3, 4, 5, 9, 58, -7, 12, 31 ∈ integers |
| 1, 0.2, 3.1 ∈ rational numbers |
Here, the beginning of the word "testing" should match the beginning of the
".":
| We are testing the program. |
| 2.35 |
The results for these tests are not defined by the spec (I don't
think). But
you shouldn't crash...:
| 3.1415926535897932384626433 1415926535897932384626433 1415926535897932384626433 1415926535897932384626433 1415926535897932384626433 1415926535897932384626433 1415926535897932384626433 1415926535897932384626433 1415926535897932384626433 1415926535897932384626433 1415926535897932384626433 1415926535897932384626433 1415926535897932384626433 1415926535897932384626433 1415926535897932384626433 1415926535897932384626433 |
| 1415926535897932384626433 3.1415926535897932384626433 1415926535897932384626433 1415926535897932384626433 1415926535897932384626433 1415926535897932384626433 1415926535897932384626433 1415926535897932384626433 1415926535897932384626433 1415926535897932384626433 1415926535897932384626433 1415926535897932384626433 1415926535897932384626433 1415926535897932384626433 1415926535897932384626433 1415926535897932384626433 1415926535897932384626433 |
| 3.1415926535897932384626433 1415926535897932384626433 1415926535897932384626433 1415926535897932384626433 1415926535897932384626433 1415926535897932384626433 1415926535897932384626433 1415926535897932384626433 1415926535897932384626433 1415926535897932384626433 1415926535897932384626433 1415926535897932384626433 1415926535897932384626433 1415926535897932384626433 1415926535897932384626433 3.1415926535897932384626433 |
| 1415926535897932384626433 3.1415926535897932384626433 1415926535897932384626433 1415926535897932384626433 1415926535897932384626433 1415926535897932384626433 1415926535897932384626433 3.1415926535897932384626433 1415926535897932384626433 1415926535897932384626433 1415926535897932384626433 1415926535897932384626433 1415926535897932384626433 1415926535897932384626433 1415926535897932384626433 1415926535897932384626433 1415926535897932384626433 |
Now for a test with multiple columns... The first column should have
cells aligned as described and be 200px wide. The second column should be
150px wide and have cells aligned to the decimal point. The third column
should also have cells aligned to the decimal points, but it should be
as big as necessary (which is wider than the widest cell contents, because
of the alignment):
| left |
3.14159 |
0.73 |
| right |
80735.6 |
1260387 |
| left |
.81 |
53.78883 |
| center |
3080 |
176.3 |
(Back to
CSS Testing Information,
David Baron)
LDB,
dbaron@dbaron.org