How would I get these to change color at the same time?
.jacket-left .circle:hover {
border: 1px solid red;
}
.jacket-left .play:hover {
fill: red;
}
I tried this way.
.jacket-left .circle:hover,
.jacket-left path:hover{
border: 1px solid red;
fill: red;
}
Hi there asasass,
try it like this, maybe…
.jacket-left .circle:hover,
.jacket-left .circle:hover .play path{
border: 1px solid red;
fill: red;
}
coothead
1 Like
How would I combine these 2 together?
I’m confused on how this one would be done.
The hover works here, the .circle just needs to be connected with the .play so they are in sync.
.jacket-left .circle:hover {
position: absolute;
top: 0;
bottom: 0;
left: 0;
right: 0;
margin: auto;
width: 44px;
height: 44px;
box-sizing: border-box;
border: 1px solid red;
border-radius: 50%;
background: rgba(0, 0, 0, 0.5);
box-shadow: rgba(0, 0, 0, 0.4) 0 0 10px;
}
.jacket-left .play:hover {
position: absolute;
left: 0;
top: 0;
right: 0;
bottom: 0;
margin: auto;
width: 24.2px;
height: 41.8px;
fill: red;
}
This worked, I’m not sure if it can be improved more than this.
.jacket-left .circle:hover {
}
.jacket-left .circle:hover .play {
}
.jacket-left .circle:hover {
position: absolute;
top: 0;
bottom: 0;
left: 0;
right: 0;
margin: auto;
width: 44px;
height: 44px;
box-sizing: border-box;
border: 1px solid red;
border-radius: 50%;
background: rgba(0, 0, 0, 0.5);
box-shadow: rgba(0, 0, 0, 0.4) 0 0 10px;
}
.jacket-left .circle:hover .play {
position: absolute;
left: 0;
top: 0;
right: 0;
bottom: 0;
margin: auto;
width: 24.2px;
height: 41.8px;
fill: red;
}
system
Closed
5
This topic was automatically closed 91 days after the last reply. New replies are no longer allowed.