-3

#ss {
  background-color: black;
  width: 1500px;
  height: 80px;
  overflow-x: 0;
  margin-top: -8px;
  margin-left: -10px;
  opacity: 0.5;
  text-align: center;
  position: absolute;
}

#as {
  background-color: #968f8f;
  width: 70px;
  height: 40px;
  opacity: 1;
  margin-top: 15px;
  position: relative;
  color: white;
  border-radius: 4px;
}

#bd {
  background-color: grey;
  background-image: url("image3.jpg");
  overflow-x: hidden;
  background-repeat: no-repeat;
  background-size: 1315px;
}
<body id="bd">

  <div id="ss">

    <table>
      <tr>
        <td>

          <button id="as"> Home </button>

        </td>

      </tr>
    </table>


  </div>

</body>

The problem is that I want div to be transparent but not the buttons inside the div.

Mr Lister
  • 45,515
  • 15
  • 108
  • 150
Unknown person
  • 3
  • 3
  • Possible duplicate of [I do not want to inherit the child opacity from the parent in CSS](http://stackoverflow.com/questions/5770341/i-do-not-want-to-inherit-the-child-opacity-from-the-parent-in-css) – Ivar May 08 '17 at 07:11
  • Possible duplicate of [Nontransparent child in transparent parent](http://stackoverflow.com/questions/3031848/nontransparent-child-in-transparent-parent) – Douwe de Haan May 08 '17 at 07:12
  • Since there is not much to see in the div except the button, why don't you just forego the opacity and use #7F7F7F for a background-color. – Mr Lister May 08 '17 at 07:15
  • instead of opacity property use background:rgba(0,0,0,0.5) property so that the background color opacity is only changed – subramanian May 08 '17 at 07:15

2 Answers2

0

Remove the background color for your parent div element:

#ss{ background:transparent; }

You can also use rgba as background color if you want to keep the div background color as: background:rgba(0,0,0,.5)

n1kkou
  • 3,096
  • 2
  • 21
  • 32
  • Depends on what you want: if you want to keep the background semi-black, use the `rgba` bacgrkound, else, just remove the background color. – n1kkou May 08 '17 at 07:17
-1

First of all remove the opacity attribute from under #ss under style tag.

If you want to remove the background entirely:
Replace:
#ss { background-color:black; }
By:
#ss { background:none; }

Else if you want to set an opacity value to the background:
Replace:
#ss { background-color:black; }
By:
#ss { background:rgba(0, 0, 0, desired_opacity_value); }
where 0(min) <= desired_opacity_value <= 1(max)

AngelDeHajra
  • 1
  • 2