Re: breaking between inline boxes

----- Original Message ----- 
From: "James Justin Harrell" <>
To: <>
Sent: Wednesday, August 01, 2007 12:18 PM
Subject: breaking between inline boxes

> The current specs are unclear about whether breaks can occur between 
> inline boxes and provide no
> way for developers to specify whether such breaks can occur. This often 
> isn't an issue because
> there's usually whitespace between or within inline elements, but this 
> means using whitespace for
> presentation.
> If breaks cannot occur between inline boxes, then when there's no 
> whitespace between inline
> elements and the inline elements cannot be broken (e.g. no whitespace, 
> replaced content,
> white-space:pre) the inline boxes will line up horizontally in a single 
> line.
> Example:
> <div><img/><img/><img/><img/>...<img/></div>
> Only the images that could fit in a single line box would be contained in 
> the div, and the rest
> would overflow.
> I encountered this when I displayed the items of a list inline (i.e. 
> li{display:inline}) and the
> list overflowed horizontally to the right since there wasn't any 
> whitespace between the li
> elements and the li elements couldn't break. (tested in Firefox 2.0 and 
> Konqueror 3.5.6) One
> solution is to add spaces between the li elements, but developers should 
> not be required to add
> non-semantic markup purely for presentation.
> If it's decided that breaks should not occur between inline boxes, then 
> I'd like to see something
> like "inline-wrap" for the display property where inline-wrap would be 
> identical to inline except
> that breaks could occur between inline boxes where necessary to prevent 
> overflow.

It is already there:

ul > li { display:inline-block; }

should do the magic in UAs that support display:inline-block (Opera, 

Andrew Fedoniouk.

Received on Wednesday, 1 August 2007 22:13:02 UTC