Task #2223 -

There is a calendar for March in the index.html file.
On each line, every 7th day should be marked with a red background.
The text color in this cell must be white.
Use the weekend class to add new styles.
Don’t use pseudo classes, ids and inline styles.
Do not change styles already added.

This task is part of the Full-Stack JavaScript Course
If you have any issues with it, you can ask for community help below the post
Feel free to help others if you’ve already solved the task

index.html

<!DOCTYPE html>
<html>
  <head>
    <title>March</title>
    <style>
      h2 {
        font-family: monospace;
        margin-bottom: 10px;
      }
      .week {
        display: flex;
        margin-bottom: 8px;
      }
      .week .day {
        color: white;
        padding: 5px 10px;
        font-family: monospace;
        font-size: 16px;
        border-radius: 4px;
        width: 25px;
        text-align: center;
        margin-right: 8px;
        background-color: rgb(255, 198, 0);
      }
      .week .day.day_name {
        font-weight: bold;
        color: black;
      }
    </style>
  </head>
  <body>
    <h2>March</h2>
    <div class="month">
      <div class="week">
        <div class="day day_name">Mo</div>
        <div class="day day_name">Tu</div>
        <div class="day day_name">We</div>
        <div class="day day_name">Th</div>
        <div class="day day_name">Fr</div>
        <div class="day day_name">St</div>
        <div class="day day_name">Su</div>
      </div>
      <div class="week">
        <div class="day">1</div>
        <div class="day">2</div>
        <div class="day">3</div>
        <div class="day">4</div>
        <div class="day">5</div>
        <div class="day">6</div>
        <div class="day">7</div>
      </div>
      <div class="week">
        <div class="day">8</div>
        <div class="day">9</div>
        <div class="day">10</div>
        <div class="day">11</div>
        <div class="day">12</div>
        <div class="day">13</div>
        <div class="day">14</div>
      </div>
      <div class="week">
        <div class="day">15</div>
        <div class="day">16</div>
        <div class="day">17</div>
        <div class="day">18</div>
        <div class="day">19</div>
        <div class="day">20</div>
        <div class="day">21</div>
      </div>
      <div class="week">
        <div class="day">22</div>
        <div class="day">23</div>
        <div class="day">24</div>
        <div class="day">25</div>
        <div class="day">26</div>
        <div class="day">27</div>
        <div class="day">28</div>
      </div>
      <div class="week">
        <div class="day">29</div>
        <div class="day">30</div>
        <div class="day">31</div>
      </div>
    </div>
  </body>
</html>