This shows you the differences between two versions of the page.
|
webdesign [2013/10/16 19:00] dlicious Initial page with multi-CSS information |
webdesign [2013/11/22 19:29] (current) dlicious Added section on rounded table corners |
||
|---|---|---|---|
| Line 1: | Line 1: | ||
| + | ===== Rounded corners on a table ===== | ||
| + | |||
| + | This CSS will give you rounded corners on your table, even if you add/remove columns and rows. | ||
| + | |||
| + | <file css rounded-table.css> | ||
| + | <!-- Top-left corner --> | ||
| + | table tr:first-child th:first-child , | ||
| + | table tr:first-child td:first-child { border-top-left-radius : 15px ; } | ||
| + | |||
| + | <!-- Top-right corner --> | ||
| + | table tr:first-child th:last-child , | ||
| + | table tr:first-child td:last-child { border-top-right-radius : 15px ; } | ||
| + | |||
| + | <!-- Bottom-left corner --> | ||
| + | table tr:last-child td:first-child { border-bottom-left-radius : 15px ; } | ||
| + | |||
| + | <!-- Bottom-right corner --> | ||
| + | table tr:last-child td:last-child { border-bottom-right-radius : 15px ; } | ||
| + | </file> | ||
| + | |||
| ===== Working with multiple CSS stylesheets ===== | ===== Working with multiple CSS stylesheets ===== | ||