Создание узла с white-space через JS

[CreamQ]

Вопрос в следующем: 

При нажатии на кнопку создается элемент "entireDrink ", в который добавляется input-картинка и span-текст, "entireDrink " получает тег "one" в котором указан параметр "White-space:  nowrap;". При повторном нажатии на ту же кнопку меняется span-текст, а при нажатии на другую добавляется еще один такой же элемент и т.д.

Мне надо, чтобы в окне div эти элементы переносились на новую строку, но не разделялась картинка с текстом, а получается, что "entireDrink "s просто множатся по оси-x.

Если добавлять без White-space:  nowrap, то все элементы переносятся отдельно: картинки и тексты.

В другом месте, созданном заранее в html это работает, т.е. узлы с тегом "one" переносятся на новую строку сразу со всем содержимым.

Помогите, пожалуйста, разобраться. Заранее спасибо.

Ниже на скриншотах: 1) заполнение без "White-space:  nowrap;" 2) С "White-space:  nowrap;"
Вот кусок кода: 

Скрытый текст

 

var parentElem = document.getElementById('basketGoods');
            var entireDrink = document.createElement('one');
                entireDrink.id = 'entireDrink'+drink.id;
            var picOfDrink = document.createElement('img');
                picOfDrink.src=document.getElementById(drink.id).src;
                picOfDrink.className="addedPic";
                picOfDrink.id="pic"+drink.id;
            var numberOfDrinks = document.createElement('span');
                numberOfDrinks.id = 'numberOfDrinks'+drink.id;
            entireDrink.appendChild(picOfDrink);
            entireDrink.appendChild(numberOfDrinks);
            parentElem.appendChild(entireDrink);

 

 

 

Скрытый текст

 

 

 

Edited October 6, 2017 by CreamQ
Уточнение

[Switch74]

У one у вас display:block; ?

 

[CreamQ]

Только что, Switch74 сказал:

one у вас display:block; ?

 

Вообще никакой не ставил. one{    white-space: inline;    }.

[Switch74]

попробуйте поставить
и вы ведь писали

Цитата

 "one" в котором указан параметр White-space:nowrap;

 

[CreamQ]

2 минуты назад, Switch74 сказал:

попробуйте поставить

Теперь вот так:

[Switch74]

one{  display:inline-block;  white-space: nowrap;    }.

[CreamQ]

2 минуты назад, Switch74 сказал:

one{  display:inline-block;  white-space: nowrap;    }.

Спасибо! Работает.