How to apply hover effect to complete card which is made by div so that the elements in the card are also hovered alongwith card

Web Development
, , ,
1

Suppose I have created a div which has a class name of card and in that div we have three elements that is 1. icon 2. heading(h2) 3. paragraph§ so how can we apply hover to this complete div as I have applied hover but it only works for heading(h2) but hover effect is not applied to p
Html Code:

MBBS Courses Worldwide

Mbbs in Abroad - Get entry to your chosen Mbbs course runnin in top university of foreign country through taking assistance of Study MBBS in Abroad.

CSS code: .assurance-card{ background: #fff; color: black; padding: 10px; border: 1px solid #444; text-align: center; transition: 0.2s; } .assurance-card:hover{ color: #fff; border: 1px solid blue; background: blue; }
2

Hi,
When you encapsulate all your elements inside the div element and applying the style to that particular class of div then automatically all the CSS properties applied to the child elements of div.
Please check your syntax with the below code :
HTML:

<div class="intro">
  <h2 id="firstname">John</h2>
  <p id="place">I live in India</p>
  <p> working as developer</p>
</div>

CSS:

.intro:hover {
background-color: grey;
}

still, the issue persists then post your HTML structure .so it makes us understand your query better.

Hope my answer will resolve your doubts. Happy Learning.