How to reduce the img size

Question

In my code CSS is no longer working, the CSS which I applied to the sections!

This image doesn't shrink, what am I missing out?

in website:

In HTML Code is:

<section  class="sec5 container">
   <div class="blockcontainer">
      <img src="img/campanha.jpg">
   </div>

In CSS is:

.blockcontainer{
  width: 10%;
  display: block;
  margin: 0 auto;
  box-sizing: border-box;
 }

(offtopic) You have `.blockcontainer` (without underscore) and `.block_container` (with underscore) That won't work. — GreyRoofPigeon, Mar 05 '18 at 15:11
Chrome > Right Click > Inspect Element > Check what CSS rules are being applied or what is overwriting yours — musefan, Mar 05 '18 at 15:11
You aren't defining any dimensions for the image. `.block_container img { width: 100% }` — Turnip, Mar 05 '18 at 15:13

Nadun Kulatunge · Accepted Answer · 2018-03-05T15:27:10.293

0

You have a mistake in your CSS,

.blockcontainer{
  width: 10%;
  display: block;
  margin: 0 auto;
  box-sizing: border-box;
 }
.blockcontainer img{
  width: 100%;
}

.block_container should be changed into .blockcontainer

edited Mar 05 '18 at 15:27

answered Mar 05 '18 at 15:14

Nadun Kulatunge

score 0 · Answer 2 · answered Mar 05 '18 at 15:21

0

Try this:

 .blockcontainer img{
      width: 100%;
      display: block;
     }

answered Mar 05 '18 at 15:21

Tasos Fel

2 Answers2