I have a ul that is set to display inline-block and list elements that are set to display inline block.
The ul is set to have a width of auto so it shrinks if the container does (responsive).
The list items are set to be auto width of their content which is set to whitespace nowrap and so if they dont all fit in a line they drop down to the next line.
I am trying to detect with jQuery if this is happening. So I am getting the inner width (using width()) of the ul and the calculating the total width of each li by getting each outerWidth() and adding them together. Then I check if the total li width is greater than the inner width of the ul.
But heres the problem, jQuery is returning a value of 933.6800003051758 for the nav's inner width and a value of 934 for the list items. So you'd think that the list items would be breaking onto a second line- but they aren't! So I suppose that the browser is rounding up the nav's innerwidth to be 934.
What I'd like to know is, if I round up the nav's inner width before I compare the value to the total list items width will that be reliable or will my function sometimes think the list items are not breaking on to a second line when in fact they are?