2016-08-31 7 views
1

У меня довольно простая проблема с html & css. Я создал нижний колонтитул с тегом <p> и тегом <li>. Внутри тега <li> у меня есть изображение, однако это изображение выходит за нижний колонтитул. Как я могу сделать изображение в тег нижнего колонтитула?Как поместить изображение в мой тег нижнего колонтитула?

HTML

<footer class="footer"> 
<p class="footerP">© Axel Halldin 2016 ©</p> 
<li class="socialMedias"> <img class="facebook" src="facebook.jpg" href="https://www.facebook.com/axel.halldin1?fref=ts"/> 
</li> 
</footer> 

CSS

.footer{ 
background-color:#003366; 
margin:0; 
padding:0; 
width:90vw; 
height:22.5vh; 
float:right; 
} 

.footerP{ 
color:white; 
font-family:FiraSans-Regular, sans-serif; 
font-size:16px; 
margin:0; 
line-height:22.5vh; 
} 

.socialMedias{ 
float:right; 
} 

.facebook{ 
width:5vw; 
height:10vh; 
} 
+0

Изображение находится внутри 'footer' тега как 'li' находится в сторона тега нижнего колонтитула – Andrew

+4

Ваш HTML недопустим. Фиксация, которая обычно является хорошим первым шагом. http://validator.w3.org/nu/ – Quentin

+0

Что такое тег Элемент списка без заказа/неупорядоченного списка? – leigero

ответ

-2

Добавить overflow:auto; в .css, как показано ниже:

.footer{ 
background-color:#003366; 
margin:0; 
padding:0; 
width:90vw; 
height:22.5vh; 
float:right; 
overflow:auto; 
}