Динамически созданные divs, не показывающиеся рядом друг с другом

Question

Я динамически создаю divs, и я хочу, чтобы они отображались рядом друг с другом. У меня есть следующий код и после применения стиля к нему (строка 5) они продолжают показывать один из других. Пожалуйста помоги.

rmc.onstream = function (e) { 
    if (e.isVideo) { 
     var uibox = document.createElement("div"); 
     uibox.appendChild(document.createTextNode(e.userid)); 
     uibox.className = "userid"; 
     uibox.id = "uibox-" + e.userid; 
     uibox.style.cssText = 'display: inline-block; float: left'; 
     document.getElementById('video-container').appendChild(e.mediaElement); 
     document.getElementById('video-container').appendChild(uibox); 
    } else if (e.isAudio) { 
     document.getElementById('video-container').appendChild(e.mediaElement); 
    } 
    else if (e.isScreen) { 
     $('#cotools-panel iframe').hide(); 
     $('#cotools-panel video').remove(); 
     document.getElementById('cotools-panel').appendChild(e.mediaElement); 
    } 

}; 

Answer 1

Ваши стили применяются только к uibox, и вам необходимо применить их к emediaElement тоже:

if (e.isVideo) { 
     var uibox = document.createElement("div"); 
     uibox.appendChild(document.createTextNode(e.userid)); 
     uibox.className = "userid"; 
     uibox.id = "uibox-" + e.userid; 
     uibox.style.cssText = 'float: left; width: 50%'; 
     e.mediaElement.style.cssText = 'float: left; width: 50%'; 
     document.getElementById('video-container').appendChild(e.mediaElement); 
     document.getElementById('video-container').appendChild(uibox); 
} 

Вот рабочая ручка - я должен был изменить свой код, так как я не могу см., откуда исходит e.mediaElement, но вы можете получить эту идею: http://jsbin.com/woluneyixa/1/edit?html,css,js,output

Если у вас все еще есть проблемы, пожалуйста, создайте рабочий код, чтобы мы могли видеть проблему, с которой вы сталкиваетесь.

Кроме того, использование display: inline-block и float: left; не является обязательным; встроенный блок не будет иметь никакого эффекта при использовании float.