I want to display menu-image at 100% in the frame of menu-card.

Error message The code below

does not respond well. At the bottom of the source code listed.
.menu-image {
  width: 100%;
}

Applicable source code

[HTML]
      
        
           Menu 
          
            
              
                
                 Blend coffee 
                <p>This is the most popular product.<br>Please enjoy not only the taste but also the aroma</p>
              
            

[CSS]
@charset "utf-8";
.menu {
  padding: 90px 0 60px;
  color: # 5a5c5f
}
.menu-card {
  width: 33%;
  margin-top: 35px;
}
.menu-card-inner {
  padding: 25px 30px;
  background-color: # dbe0e4;
  border-radius: 7px;
  box-shadow: 1px 1px 4px # d2d4d6;
  text-align: center;
}
.menu-image {
  width: 100%;
}

I tried other than

width, but it doesn't respond.
Previous
.menu-card-inner {
Seems to be reflected.

Supplemental information (FW/tool version etc.)

Please provide more detailed information here.