Question

Due to the length of the code I can not post it here, I have created a demo page.

1. Using IE to open the page.
2. Click on “Add” link.
3. Then, click on “Specify Request types”.

Bellow is a screenshot from IE8:

You should be able to see the desired layout when view the page using Chrome, Safari and Firefox

This is a screenshot from Chrome.

For IE, I have tried to put the list of checkbox into a div(#request_type) and set its width (to something like 150px), hope that the checkbox list will wrap around, but it didn’t work.

Answer 1

For a consistent look simply define your label elements as display:inline-block for IE only by using a conditional comment that you can place in the header of your document, like so:

<!--[if lt IE 9]>
.ui-button {
    display: inline-block;
}
<![endif]-->