1

So, here is my problem. I'm making a website, and my HTML file just refuses to work with classes. Here is my html code and CSS :

.card {
  width: 400px;
  margin: 0 auto;
}
<div class="card">
  <img src="img/paarthurnax.jpg" alt="Sorry, we have troubles with connection">
</div>

Image does not line up properly when class is used. Interestingly, if i substitute ".card" with simply "div", it works.

But it refuses to work with classes. I also tried doing it with different datatypes, like paragraph, title and lists, and classes still don't work. I tried looking into possible "grammar" mistakes, but in tutorial video i watched, it used same code, letter-to-letter and it worked. Brackets' latest version was used to write code, if it can help.

Ray
  • 1,539
  • 1
  • 14
  • 27
Delilow
  • 13
  • 2
  • 1
    Can you show your desired output on this one? It's difficult to tell why your CSS doesn't work when using classes but DIV as a selector works on your case. – MarLMazo Feb 09 '21 at 03:08
  • Does this answer your question? [CSS Image expanding over parent div size](https://stackoverflow.com/questions/35703139/css-image-expanding-over-parent-div-size) – Zsolt Meszaros Feb 09 '21 at 13:19

1 Answers1

1

your code:

.card {
    width : 400px;
    margin: 0 auto;
}

possible solution:

.card {
    width : 400px;
    margin: 0 auto;
}
.card img{
    width : 100%;
    height : auto;
}
Shiz
  • 695
  • 10
  • 27