Почему не работает тег span
У меня html 5. Частично не работает код:<a href="tel" id="popup__toggle"><span class="circlephone" style="transform-origin: center;"></span><span class="circle-fill" style="transform-origin: center;"></span><span class="img-circle" style="transform-origin: center;">**<SPAN class="img-circleblock" style="transform-origin: center;"></SPAN>**</span></a> А именно не работает SPAN (в коде отличается заглавными буквами). <SPAN class="img-circleblock" style="transform-origin: center;"></SPAN> - Этот участок кода не работает если написан span и он отвечает за изображение телефонной трубки на странице html. Если поменять span на <div> то W3 валидатор определяет ошибку. Вот ссылка на код css:код css Я перепробовал комбинации всевозможных тегов методом тыка и помощью гугла, результат был такой- если изображение отображалось правильно, начинал ругаться валидатор, а если валидатор был доволен то изображение отображалось частично (телефонная трубка исчезала).
Вот ссылка на код css:код css
. Вот так ругается валидатор W3: тип документа не позволяет использовать здесь элемент «div»; отсутствует один из "object",.........
Одна из возможных причин этого сообщения заключается в том, что вы попытались поместить элемент уровня блока (например, «<p>» или «<table>») внутри встроенного элемента (например, «<a>», «<span> "или" <font> ").
Ответы (1 шт):
у тега span проблемы, когда нет текста внутри - тогда и с шириной проблемы и с прочими прелестями
поэтому или замените его на div (пофиг на ошибки) или выставите свойство display: inline-block
.img-circleblock{
display: inline-block;
/*тут остальные ваши стили*/
}
P.S.
кстати вместо этой связки
<a href="#"><span class="img-circleblock" style="transform-origin: center;"></span></a>
можно же сделать эту:
<a href="#" class="img-circleblock" style="transform-origin: center;"></a>
при условии конечно, то будет указан display: inline-block
P.P.S.
кстати я прогнал ваш код через валидатор и на div он не ругался
поэтому лучше если бы вы и саму ошибку привели бы