css styles aren't applied on classes-CodePudding

I'm trying to create a social card (similar to Facebook). I don't know why I can't modify my classes inside CSS, but when I style them directly they work.

.card {
  display: inline-block;
  width: 600px;
  height: 145px;
}

.image-section {
  width: 130px;
  display: inline-block;
}

.image {
  width: 90px;
  vertical-align: middle;
  border-radius: 90px;
}

.name {
  font-size: 55px;
}

<div class=”card”>
  <div class=”image-section”>
    <img class=”image” src="images/photo.png">
  </div>
  <div class=”info-section”>
    <p class=”name”>Roland</p>
    <p class=”tag”>@roland00</p>
    <p class=”gender”>Male</p>
  </div>
  <div class=”button-section”>
    <button class=”btn” type=”button”>Follow</button>
  </div>
</div>

CodePudding user response：

Now its applying you have mistake in your double inverted comma.

.card {
  display: inline-block;
  width: 600px;
  height: 145px;
}

.image-section {
  width: 130px;
  display: inline-block;
}

.image {
  width: 90px;
  vertical-align: middle;
  border-radius: 90px;
}

.name {
  font-size: 55px;
}

<div >
  <div >
    <img  src="images/photo.png">
  </div>
  <div >
    <p >Roland</p>
    <p >@roland00</p>
    <p >Male</p>
  </div>
  <div >
    <button  type="button">Follow</button>
  </div>
</div>

CodePudding user response：

when naming the classes in html use this instead of class=”card”

CodePudding user response：

I can see only one reasons: You put css styling tag after the html code.