Как обернуть два пролета в одну строку с помощью CSS

Question

Я хочу обернуть две spans в одну строку с помощью CSS.

Вот мой код:

<div style="width:60px;">
    <span id="span1" style="float:left; display:inline;"></span>
    <span id="span2" style="float:left; display:inline; "></span>
</div>

Но это не работает.

Как это сделать?

Edit:

Я хочу использовать «id», используйте div или span, я просто хочу, чтобы они были в одной строке.

Когда я просто использую span без стиля, содержимое не в одной строке. Вторая строка опустится.

Answer 1

<div style="float:left;">
<span style="display:inline;"></span>
<span style="display:inline; "></span>
</div>

Answer 2

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

Answer 3

Возможно переполнение?

<div style="width:60px; overflow:hidden;">

Answer 4

Стили float и display являются взаимоисключающими, поэтому нет смысла использовать их вместе.Кроме того, <span> по умолчанию равно display:inline;, так что в любом случае это излишне (если у вас нет другого стиля, где-то в другом месте?).

Answer 5

Это оставленный поплавок, который заставляет это быть на отдельных строках. Возможно, попробуйте   (неразрывный пробел) между промежутками.