If you have any ideas for a different title, please share.
Check out this JSFiddle to see the issue in action: http://jsfiddle.net/VXsAg/
Essentially, my challenge is creating an element with a fixed height and width that expands horizontally as needed. If the contents exceed the fixed height, a vertical scrollbar should appear. The catch is that I want only a vertical scrollbar, allowing the element to stretch horizontally without limitation. Unfortunately, achieving this in a cross-browser compatible manner has proven difficult. Here's what I'm running into (top box for reference, bottom box illustrates the problem):
In IE8, IE9, and Opera 11.60, it looks great:
However, in IE7, Chrome 17, and Firefoxes 3 & 10, disaster strikes:
I understand the issue (width calculation predates scrollbar consideration), but how can I find a workaround?