2 divs inline, overflow:hidden on the left one


I have 2 divs which contain text of a variable length that I want to be displayed inline, in only 1 text line. The first div have float:left; the second have float:right;.

The issue I have is when the left div have a very long text inside that won't fit. I've put a fixed height and overflow:hidden on it, but it is not working unless I also put a fixed width, which I really try to avoid.
Who is Participating?

[Webinar] Streamline your web hosting managementRegister Today

Julian MatzConnect With a Mentor Joint ChairpersonCommented:

The problem is that variable-width floats will give variable results.

A possible work-around to achieve the desired effect of a two-column layout with one variable-width column is to use a floated div for the first column, but remove the float from the column that you would like to resize automatically. Because the floated column is separated from the normal document flow, the regular div should wrap around the the floated one.

I'm not sure if this is what you're looking for. If not, maybe you could post an example, maybe a screenshot.
All Courses

From novice to tech pro — start learning today.