Beginning CSS: Cascading Style Sheets for Web Design, 2nd ...

Chapter 12: TablesWhereas, if I flip the values around, as in the following:table {border: 1px solid rgb(200, 200, 200);caption-side: bottom;width: 100%;table-layout: fixed;border-spacing: 15px 0;}I get 15 pixels of space between the left and right edges of each cell. The result is shown in Figure 12-14.Figure 12-14Now that I’ve shown you how to control the spacing between cells, you can apply this knowledge tothe Spicy Thai Peanut Sauce recipe table. The following Try It Out demonstrates a practical use of theborder-collapse property in action.Try It OutApplying Cell SpacingExample 12-4. The following steps show how to work with cell spacing.1. Open Example_12-3.css and make the following modifications to the file:table.recipe {width: 100%;margin-bottom: 5px;table-layout: fixed;border-collapse: collapse;}2. Save the file as Example_12-4.css.3. Update the markup in Example_12-3.html to reflect the new style sheet:481