Проблема с изменением размера изображения на мобильном телефоне (PHP)

Question

В настоящее время я вставляю код css, чтобы сделать мой сайт (PHP) мобильным для мобильного телефона.Проблема, с которой я сталкиваюсь, заключается в желании уменьшить размер изображения до 50% как по высоте, так и по ширине.это не меняет размер изображения ...?Ниже приведен код для изображения и раздел css для моих настроек мобильного телефона:

HTML

<meta name="viewport" content="width=device-width, initial- 
scale=1.0">

<div class="logo">
   <img src="./img/newlogo.png" alt="logo" />
</div>

CSS code:

@media only screen and (max-width: 736px){
  .logo{
    position:absolute;
    top:2%;
    left:10%;
    Width:50%;
    Height:50%
  }
}

Есть идеи?

Answer 1

Переместите свой логотип класса на изображение

<div>
   <img class="logo" src="./img/newlogo.png" alt="logo" />
</div>