Как отобразить пустой элемент?

Question

[Матвей Мамонов]

Помнится, раньше как-то решал этот вопрос, но сейчас потерял решение, поэтому и прошу о помощи.

В общем имеется такой HTML код:

<span>
	<svg-icon>
		<src href="/app/views/image/icon/close.svg" />
	</svg-icon>
</span>

и такой CSS:

div.layer > span {
	transition: opacity 0.1s ease, visibility 0s linear 0.1s, transform 0.2s ease;
	transform: rotate(90deg);
	margin: 0px;
	padding: 20px;
	top: 0px;
	right: 0px;
	text-align: center;
	visibility: hidden;
	opacity: 0;
	position: fixed;
	cursor: pointer;
}

div.layer.show > span {
	transition-delay: 0s;
	transform: rotate(0deg);
	visibility: visible;
	opacity: 1;
}

Так вот эта SVG картинка не отображается. Блок есть (40 на 40), навести на него можно, нажать можно, но картинка не отображается. А отображается только тогда, когда после span вставляю хоть какую-нибудь букву. Как отобразить эту картинку без каких-либо дополнительных символов? А то что-то подзабыл.

Answer 1

[NKros]

Сделать span блочным элементом.

Comments

[Матвей Мамонов]

Не помогает.

[NKros]

Оформите в jsfiddle ваш пример.

[Сергей Сергей]

Матвей Мамонов: высота и ширина?
А вообще  

[Сергей Сергей]

& nbsp; вообще-то.

[Матвей Мамонов]

Сергей Сергей: & nbsp;, вообще-то, - это тот же пробел. А я сказал, что никакой символ нельзя использовать, ибо это нарушает конструкцию, вид, и вообще крайне не рекомендуется.

[Сергей Сергей]

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

[Матвей Мамонов]

Сергей Сергей: Да, действительно, вот об этом я и забыл, пока бэкэндом занимался, спасибо.

Пишите в ответ, сделаю решением.

[Сергей Сергей]

Матвей Мамонов: да ладно.

Answer 2

[Макс Куликов]

div.layer > span {
display:block;
}

Comments

[Матвей Мамонов]

Нет, под предыдущим ответом отписал же.