Выравнивание текста по вертикали в изображении HTML

#html #css #visual-web-developer

#HTML #css #visual-веб-разработчик

Вопрос:

На моем личном веб-сайте есть изображение, на котором при наведении на него отображаются ссылки на мои страницы в социальных сетях. Однако эти ссылки идут горизонтально и не выравниваются в поле. Как я могу сделать так, чтобы он был вертикальным и вписывался в изображение.

ссылка на изображение

 <div class="container">
<h1>Socials</h1>
<div class="row">
<div class="col-md-12 profile-pic text-center">
<div class="img-box">
<img src="img/myself5.jpg" class="img-responsive">
<ul>
<a href="https://www.instagram.com/landn.dev/"><li><i class="fa fa-instagram"></i>@landn.dev</li></a>
<a href="https://twitter.com/LandenMick"><li><i class="fa fa-twitter"></i>@LandenMick</li></a>   
<a href="https://github.com/landenthemick"><li><i class="fa fa-github"></i>@landenthemick</li></a>   
</ul>
</div>    
    <h2>Landen Mick</h2>
    <p>Programmer</p>
</div>
</div>
 

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

1. Если проблема решена путем добавления <li> открывающих тегов, пожалуйста, удалите вопрос добровольно. Правила SO требуют, чтобы мы закрывали и удаляли проблемы, вызванные опечаткой, поскольку они не имеют значения для сообщества SO. Если у вас есть дополнительные вопросы / вопросы, пожалуйста, отредактируйте свой вопрос соответствующим образом.

2. Я только что увидел, что вы добавили <li> тег после ссылок, а не забыли добавить их вообще. Однако это все еще недопустимое использование HTML. должно <li> быть сразу после ul ol тега or . Они должны быть перед a тегом