Select Rendering Problem in MS IE8?


I’m developing Vaadin Portlet using Vaadin 6.6 and Liferay 6.0.6, from time to time, when using MS IE8, I can see the “Select” under form was not rendered properly in IE8 browser, the text input area and drop-down arrow were separated in two lines as the attached png file shown. Is this a bug in Vaadin or is related to Liferay Portal?

Thanks a lot!


Actually the Screenshot is attached here

Does this only occur when the page is zoomed in IE?

No, I did not either zoom in or zoom out the page, this would occur occasionally when portlet is in normal mode in IE8



Well, by looking at the screenshot it definitely looks zoomed in, the edges of the ComboBox lines are blurry and the font size is much bigger than the default 12px. Still, it shouldn’t break if you zoom it (as the other comboboxes don’t).

So, it is a bug and will be fixed?



Looks like a bug, but does not seem to occur in every situation where you have a combo box and zoom in in IE8.

To be able to fix it, we would first have to be able to reproduce it. If you have a short sample program which does reproduce the bug (along with instructions, e.g. how to zoom the browser and which browser version), you could
create a bug report
about it, including the test.

same here with chrome on mac OS, zoomed out to 83% (it’s ok on 100%)

Here’s my ComboBox code, it happens for a Select as well.

public class CategoriesSelect extends ComboBox {

	private static final long serialVersionUID = 1L;

	public CategoriesSelect() {
		// this.setWidth(20, Sizeable.UNITS_EM);
		this.pageLength = 15;
		this.setInputPrompt("select a category");
		this.setRequiredError("Please fill in category");
		for (CategoriesEnum cats : CategoriesEnum.values()) {

One possible clue is that I’m getting the error message below when I’m starting up (using mvn gae:run).
It’s possible this is the cause of the problem but then at least you know next time someone complains about broken comboboxes :wink:
I recompiled the widgetset but can’t get rid of the discrepancy, postponed spending more time on it because it seemed to work…

small followup, I fixed the warning and still see the same behaviour, so it’s probably a bug.


I don’t know whether you have icons in your ComboBox or not, but just thought that this might be related to
this bug
. So you could try setting a defined width to the ComboBox.


Some of the people on my team are seeing this same behavior on the demo site if you look under the Selects tab