#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 issue I am facing is that I want the main div to be transparent but not affect the transparency of the buttons within it.