Can't set element.style.float in Firefox?

I've posted the following javascript code as a fiddle. It's pretty basic, and works fine in IE11 and in Chrome, but FireFox quietly throws away my `float` settings. When I inspect the elements with FireBug, neither of them have `float` set in their style. Why? Surfing the web, I've gotten the vague impression that it has something to do with `width` needing to be set somewhere, but where? And if that's the issue, is there a way for me to do this in firefox without knowing the width of the container? ``` var titleElem = document.createElement("div"); titleElem.innerHTML = "Testing"; titleElem.setAttribute("unselectable", "on"); titleElem.style.border = "0px transparent"; titleElem.style.width = "auto"; titleElem.style.float = "left"; titleElem.style.whiteSpace = "nowrap"; titleElem.style.overflow = "hidden"; titleElem.style.position = "relative"; document.body.appendChild(titleElem); rangeElem = document.createElement("div"); rangeElem.setAttribute("unselectable", "on"); rangeElem.style.width = "auto"; rangeElem.style.border = "0px transparent"; rangeElem.style.float = "right"; rangeElem.style.whiteSpace = "nowrap"; rangeElem.style.overflow = "hidden"; rangeElem.style.position = "relative"; rangeElem.style.fontSize = "x-small"; rangeElem.style.paddingRight = "5px"; rangeElem.className = "rangeDiv"; rangeElem.innerHTML = "<i>[1234 - 5678]</i>"; document.body.appendChild(rangeElem); ```