В Chrome добавлен дополнительный тег между списком тегов

#html #css

#HTML #css

Вопрос:

Я пытаюсь создать меню, состоящее из тегов с ‘display:block’, и кажется, что между каждыми двумя тегами a между ними вставляется еще один тег a — по крайней мере, в Chrome. Я нахожу это поведение наиболее странным. Что я могу сделать, чтобы избавиться от них?

Вот код:

 <html>
<head>
<style>
.monespace_menu-items a {
text-decoration: none;
padding-top:5px;
width:100%;
color:#D3D3D3;
margin:0;
display:block;
padding-left:5px;
padding-bottom:5px;
}
.monespace_menu-items a:hover {
color:white;
background-color:black;
}
</style>
</head>
<body>

<div class="monespace_menu-items">
    <a href="#">href 1<a/>
    <a href="#">href 2<a/>
    <a href="#">href 3<a/>
</div>

</body>
</html>
  

Вот JSFiddle: https://jsfiddle.net/75ybtuv1/2 /

Приветствуется любой ввод.

Спасибо!

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

1. У вас опечатка, вы должны закрыть свой тег так </a> , а не так <a/>

Ответ №1:

ваш тег, подобный этому </a> , не похож на этот <a/>

       <html>
        <head>
        <style>
        .monespace_menu-items a {
        text-decoration: none;
        padding-top:5px;
        width:100%;
        color:#D3D3D3;
        margin:0;
        display:block;
        padding-left:5px;
        padding-bottom:5px;
        }
        .monespace_menu-items a:hover {
        color:white;
        background-color:black;
        }
        </style>
        </head>
        <body>
    
        <div class="monespace_menu-items">
      <a href="#">href 1</a>
      <a href="#">href 2</a>
      <a href="#">href 3</a>
        </div>
    
        </body>
        </html>