Как дать пустой элемент ширины и высоты?

Question

У меня есть пустой элемент на моей странице, который я бы хотел указать на ширину и высоту.

Вот jsfiddle для иллюстрации: http://jsfiddle.net/tzxv5zb3/

Как вы видите, я попытался дать элементу атрибут стиля с некоторыми значениями ширины и высоты. Например:

<span id="element-b" style="width: 100px; height: 20px; background-color: #555;"> </span> 

Однако это ничего не значит.

Как дать мой пустой элемент (#element-b) некоторой ширины и высоты?

Answer 1

span является встроенным элементом. Попробуйте использовать div, или же добавить

display:block; 

к вашему стилю

Пример в your fiddle

Answer 2

пролеты являются встроенные элементы по умолчанию, которые не дают вам никакого выбора, чтобы манипулировать их размеры. Попробуйте следующее:

<span id="element-b" style="display: inline-block; width: 100px; height: 20px; background-color: #555;"></span> 

Answer 3

Простой ответ: Нанести «` дисплей: встроенный блок;» стиль для пролета.

Для старых версий IE вам необходимо применить «zoom: 1;» INSTEAD свойства встроенного блока. Мне жаль говорить, что я не могу вспомнить, какая самая высокая версия вам нужна для этого, но я знаю, что вам нужно это для 7.

Answer 4

Это потому, что span является встроенным элементом. Чтобы он соблюдал правила ширины/высоты, вам нужно сделать это block или inline-block.

См: http://jsfiddle.net/tzxv5zb3/1/