HTML/CSS series 1

This is Exercise 1. How can i move my styling from html to css? When i copy and paste it, it’s not working properly. Please help. Thank you.

<meta charset="UTF-8">

<meta http-equiv="X-UA-Compatible" content="IE=edge">

<meta name="viewport" content="width=device-width, initial-scale=1.0">

<title>Document</title>

<style>

    table,

    td,

    th {

        border-bottom: 1px solid #c4dcf3;

        border-collapse: collapse;

        padding: 5px;

    }

    

    tfoot {

        text-align: left;

    }

    

    tbody tr:nth-child(odd) {

        background-color: #eef7ff;

    }

</style>
<table>

    <thead style="background-color: #427fef;">

        <tr>

            <th>Country</th>

            <th>OrderID</th>

            <th>Order Amount</th>

        </tr>

    </thead>

    <tbody>

        <tr>

            <td>USA</td>

            <td>1000</td>

            <td>$1,300</td>

        </tr>

        <tr>

            <td>USA</td>

            <td>1001</td>

            <td>$700</td>

        </tr>

        <tr>

            <td>CA</td>

            <td>1002</td>

            <td>$2,000</td>

        </tr>

        <tr>

            <td>CA</td>

            <td>1003</td>

            <td>$1,000</td>

        </tr>

    </tbody>

    <tfoot>

        <tr style="background-color: #427fef;">

            <th>Total</th>

            <th align="center" colspan="2">$5,000</th>

        </tr>

    </tfoot>

</table>

do not copy the styling tag and remove commas

1 Like

Tell me if you need any help

1 Like