Why It s Bulletproof

Why It's Bulletproof

By stripping the example down to a core, semantic structure, we rebuilt the table using only the essential elements. Along the way, we increased the accessibility of the table while trimming the code down by a gigantic amount. In addition, we were able to re-create the table's stylish appearance using no images whatsoever, untangling the design from the markup and moving it over to CSS. Future updates to the design and/or data will be easier, and we won't have to wade through dozens and dozens of extra table cellscells that exist solely for the purpose of stylizing the table.

The table itself is also flexible from a height and width point of view. We've refrained from specifying a pixel dimension on anything, and since no images are used, this design could be dropped inside any container and will stretch to fit (Figure 7.17).

Figure 7.17. Widening or shrinking the container of the table won't hinder this design, with its ability to expand and contract flawlessly.