title: How to apply Opacity On A DIV container background only and not change the text and check boxes
body: <p>Is there a better way to make this work in 2020 on all browsers?</p>
  
  <p>I want to make the background of the div have a reduced opacity and allow the remaining content to stay normal...</p>
  
  <pre><code>#menu {
    display: grid;
    grid-template-columns:auto 1fr;
    background-color: black; opacity: 0.6;
    width: 180px;
    font-family: Arial, Helvetica, sans-serif;
    color: beige;
   }
  </code></pre>