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

Я хочу обернуть два 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 без стиля, содержимое не находится в одной строке. Вторая строка опустится.

Ответ 1

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

Ответ 2

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

Ответ 3

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

Ответ 4

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

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

Ответ 5

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