Столкновение размеров изображений WP и woocommerce CSS в нижнем колонтитуле

#css #wordpress #image #woocommerce

#css #wordpress #изображение #woocommerce

Вопрос:

У меня есть два изображения в моем footer.php они жестко запрограммированы и должны оставаться такими:

 <img src="<?php echo get_template_directory_uri(); ?>/img/logo.png" height="30"> is an  
<a href="https://www.#.com" target="_blank" ><img src="<?php bloginfo('template_directory')?>/img/logob.png" height="30">
  

на страницах woocommerce по какой-то причине эти два логотипа отображаются действительно большими (оригинальный размер). При проверке кажется, что мои 30 пикселей перезаписываются woocommerce.css:

 .woocommerce img, .woocommerce-page img {
height: auto;
max-width: 100%;
  

}

Я попытался изменить это в моем custom.css, чтобы вернуть мои маленькие изображения в:

 .woocommerce img, .woocommerce-page img {
height: 30px;
max-width: 100%;
  

}

Но это приводит к сокращению всех изображений на странице, есть идеи, как я могу указать моему custom.css, чтобы размеры изображений сохранялись в нижнем колонтитуле в ЛЮБОМ МЕСТЕ страницы?

Ответ №1:

Кажется, нет класса или идентификатора для выбора нужного изображения, поэтому я увидел, что у вас есть атрибут в вашем теге изображения, который height="30" , его можно использовать как селектор, чтобы просто выбрать это изображение, а не другие. Вот что вы можете сделать, чтобы выбрать его:

.woocommerce img[height=30], .woocommerce-page img[height=30] { height: 30px; max-width: 100%;}

Комментарии:

1. Спасибо, пробовал, не сработало, но дал мне правильную идею исправить это!

Ответ №2:

Я добавил .smallfooter класс к изображению в footer.php , теперь он отлично работает на всех страницах. Я вызывал класс .small раньше, по какой-то причине он был перезаписан bootstrap css, поэтому предоставление ему нового уникального класса . smallfooter сделало это!