Buttons - I

Lesson 10 of 13 in Coddy's Sidebar | Front-end Project course.

Challenge

Medium

Target both #openSidebarBtn and #closeSidebarBtn:

1. Set background color according to your choice

2. Disable the border styling

3. Set border radius according to your choice

4. Set padding according to your choice

5. Set font size according to your choice

Try it yourself

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <link rel="stylesheet" href="styles.css">
  <title>Mobile Sidebar</title>
</head>
<body>
  <button id="openSidebarBtn">Open</button>
  <div id="sidebar" class="sidebar">
    <button id="closeSidebarBtn">Close</button>
    <!-- Your sidebar content goes here -->
    <p>Home</p>
    <p>About</p>
    <p>Services</p>
    <p>Contact</p>
  </div>
  <script src="script.js"></script>
</body>
</html>