Как сделать чтобы логотип имел постоянный размер?

Question

[sempai1992]

Недавно начал изучать HTML но так и не дошёл до CSS, а мне нужно чтобы логотип выглядел одинаково на всех устройствах, как это сделать? esurma.ru

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

media screen and (min-width:768px) and (max-width: 1024px){
.logo img{
width: 15%;
}
#flex-head h1{
font-size:48px;
}
#flex-head h2{
font-size:18px;
}
.main-caption .btn-clear, .main-about .btn-clear{
padding:8px 14px;
}

.title-page h2{
font-size:24px;
}
}


media screen and (min-width:481px) and (max-width: 767px){
footer{
     margin-bottom:0;   
}
.logo img{
width: 15%;
}
#flex-head h1{
font-size:36px;
}
#flex-head h2{
font-size:14px;
padding:0 0 8px 0;
}
.main-caption .btn-clear, .main-about .btn-clear{
padding:8px 14px;
}
.title-page h2{
font-size:18px;
}
}
media screen and (min-width:240px) and (max-width: 480px){
.logo img{
width: 15%;
}
#flex-head h1{
font-size:24px;
}
#flex-head h2{
font-size:14px;
padding:0 0 8px 0;
}
.main-caption .btn-clear, .main-about .btn-clear{
padding:6px 14px;
}
.title-page h2{
font-size:24px;
}

Answer 1

[Максим]

Для этого нужно задавать размер изображения не в %, а, допустим в px или em.

Answer 2

[Ленар Фаттахов]

Используйте абсолютные единицы измерения
htmlbook.ru/css/value/size