Почему переносится текст на следующую строку?

Question

[Mayaya]

Всё в строчку под одним тегом :

<div class="bars" ><?=round($USERS['score']);?> / <?=$rus[$ur];?> &nbsp;<?=$rn[$ur]?> &nbsp;<?= $login;?> <?=round($USERS['balance']);?> <?=round($USERS['rubin']);?></div>

Если я добавляю ещё один тег то он переносится на след. строку

<div class="bars" ><?=round($USERS['score']);?> / <?=$rus[$ur];?> &nbsp;<?=$rn[$ur]?> &nbsp;<?= $login;?></div><div class="bars" ><?=round($USERS['balance']);?> <?=round($USERS['rubin']);?></div>

Полный:

<link rel="stylesheet" type="text/css" href="static/style/background.css">  
<img src="./static/img/inputs/bar.png" >
 
		<input class="spritebig" id="spritebigRank<?=$USERS['frank'];?>" style="box-shadow: none; background-color: transparent; height: 54px; width: 54px;" type="button">
                           <div class="bar" style="display: inline-block"> 
                           </tbody>
                           </tbody>
						   </table>		
<div class="bars" ><?=round($USERS['score']);?> / <?=$rus[$ur];?> &nbsp;<?=$rn[$ur]?> &nbsp;<?= $login;?></div><div class="bars" ><?=round($USERS['balance']);?> <?=round($USERS['rubin']);?></div>

В CSS:

.bars {
	
	color: #13ec00;
	margin-left: -983px;
	margin-top: 10px;
	font-size: 11px;
	padding: 0;

	}

Comments

[Ankhena]

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

Можно сделать div'ы инлайн-блочными.
Можно заменить их на span.
Или еще какой-нибудь вариант.

И хорошо бы разобраться с кашей в коде из кусков тегов, атрибутов, стилей...

Answer 1

[Иван Доброславин]

Не очень понятно, что имеется ввиду.
Если вы добавляется ещё один div-блок, то он будет автоматически перенесён на следующую строку.
Чтобы этого не было, нужно к предыдущему и новому добавить, например, display:inline-block или display:inline.

Answer 2

[Loshara Tupoi]

Понял твою проблему.
Тем, что ты ставишь теги в одну строчку, этим переноса не избежать
В CSS к двум твоим тегам DIV добавь следующее:
display: inline-block;