Почему h3 появляются не в строчку?

Question

[Арсений Соколовский]

Есть скрипт:

if (next_name.isLineEnding == 0) {
                            Lines = ''
                            if (endLine == true) {
                                document.getElementById('lirycs').innerHTML = ''
                                endLine = false;
                            }
                            Lines = Lines + next_name.text;
                            let part = document.createElement('h3');
                            part.innerHTML = Lines;
                            part.className = 'Part';
                            part.id = 'part' + LyrI;
                            document.getElementById('lirycs').innerHTML+= "<h3 id='part'>" + part.innerHTML + "</h3>";
                        } else {
                            Lines = next_name.text;
                            let part = document.createElement('h3');
                            part.innerHTML = Lines;
                            part.id = 'part' + LyrI;
                            document.getElementById('lirycs').innerHTML+= "<h3 id='part'>" + part.innerHTML + "</h3>";
                            endLine = true;
                            Lines = ''
                        }

                        next_name = Lyr.shift();
                        LyrI++;

который должен создавать элементы h3 с текстом, вроде все работает отлично, но, создает оно почему то не в строчку, а так:

уже и пробовал ширину менять у главного дива где лежат эти h3, и высоту - ничего не помогает.
Что я делаю не так? Может надо что-то изменить в скрипте или добавить стили в css? Помогите пожалуйста.

Comments

[Rustam Bainazarov]

display: inline;

[Арсений Соколовский]

Рустам Байназаров, а, надо попробовать, спасибо

[v3shin]

А зачем вы собираете несколько h3, если можно собрать строку полностью и поместить в один h3?

[Rustam Bainazarov]

Mellorn, именно. Спасибо, исправил.

[Арсений Соколовский]

v3shin, мне так надо. я
Я собираюсь анимировать эти кусочки текста, то есть чтобы они увеличивали плавно свою ширину, сложно объяснить но в моей голове это так

[Арсений Соколовский]

Рустам Байназаров, спасибо, помогло

Answer 1

[Sergei Nazarenko]

Почему h3 появляются не в строчку?

потому что тег H блочный элемент https://jsfiddle.net/ywu4m7po/1/