-1
I need to remove these edges (which I highlighted in green) that are in my extension. I want there to be nothing there or at least to be transparent so that the box-shadow
have effect and stay round as well as the div
.
I’ve tried to define the background-color
of body
for transparent
but it doesn’t work. I also tried to round up the body
along with the div
to see if corrected but also failed to work.
Follows image demonstrating:
Just follow my code:
* {
padding: 0;
margin: 0;
}
body {
background-color: #48ff00;
margin: 0%;
border: none;
outline: 0;
}
#corpo {
width: 300px;
height: 200px;
background-color: #592C90;
box-shadow: rgb(0 0 0 / 10%) 0 2px 4px 0;
border: 2px #000000 solid;
border-radius: 15px;
}
/* ------ Botões ------ */
.toggle {
margin-bottom: 20px;
}
.toggle > input {
display: none;
}
.toggle > label {
position: relative;
display: block;
height: 28px;
width: 52px;
background-color: #F7F7F7;
border: 2px #8E8F93 solid;
border-radius: 100px;
cursor: pointer;
transition: all 0.3s ease;
}
.toggle > label:after {
position: absolute;
left: 1px;
top: 1px;
display: block;
width: 26px;
height: 26px;
border-radius: 100px;
background: #fff;
box-shadow: 0px 3px 3px rgba(0,0,0,0.05);
content: '';
transition: all 0.3s ease;
}
.toggle > label:active:after {
transform: scale(1.15, 0.85);
}
.toggle > input:checked ~ label {
background-color: #4cda64;
border-color: #8E8F93;
}
.toggle > input:checked ~ label:after {
left: 25px;
}
.toggle > input:disabled ~ label {
background-color: #d5d5d5;
pointer-events: none;
}
.toggle > input:disabled ~ label:after {
background-color: rgba(255, 255, 255, 0.3);
}
<!DOCTYPE html>
<html>
<head>
<link href="style.css" rel="stylesheet">
</head>
<body>
<div id="corpo">
<div class="toggle">
<input type="checkbox" id="onoff">
<label for="onoff"></label>
</div>
<div class="toggle">
<input type="checkbox" id="onoff2">
<label for="onoff2"></label>
</div>
</div>
</body>
</html>
can’t just remove the
background-color
of the body?– Ricardo Pontual
@Ricardopunctual if you do that he turns white
– Roger Windberg