Hover component in firefox

[edulid]

I have a hover component that contains an image (got from the database). In chrome, the component is growing accordingly to show the whole image, which is good.
But in firefox I see the screenshot attached.
Why isn't this working in firefox and how to correct it ?
Using 6.0-p20160519, chrome 51.0.2704.103 and firefox 47.0.1

Testcase:

public void onModuleLoad() {

        Canvas canvas = new Canvas();

        final ListGrid countryGrid = new ListGrid();
        countryGrid.setWidth(500);
        countryGrid.setHeight(224);
        countryGrid.setShowAllRecords(true);
        countryGrid.setSelectionType(SelectionStyle.SINGLE);
        
        countryGrid.setCanHover(true);
        countryGrid.setHoverCustomizer(new HoverCustomizer() {
            @Override
            public String hoverHTML(Object value, ListGridRecord record, int rowNum, int colNum) {
                String imgStyle = "padding-top: 6px; padding-bottom: 8px;";
                String imgUrl = "https://upload.wikimedia.org/wikipedia/commons/8/84/Namibie_Etosha_Elephant_02.JPG";
                return ("<span style=\"font-weight:bold\">" + "Title" + "</span><br />"
                        + "<img height=\"200\" style=\"" + imgStyle + "\" src=\"" + imgUrl + "\"><br />");
            }

        });

        ListGridField nameField = new ListGridField("countryName", "Country");
        ListGridField capitalField = new ListGridField("capital", "Capital");
        ListGridField continentField = new ListGridField("continent", "Continent");
        countryGrid.setFields(nameField, capitalField, continentField);

        countryGrid.setData(CountrySampleData.getRecords());

        canvas.addChild(countryGrid);

        canvas.draw();
    }

[edulid]

I solved this writing the image size explicitly, calculating it from the DB values.
But is this a bug? In chrome it works and in firefox not.

[Isomorphic]

The Firefox behavior is the expected behavior here, since you are placing content into the hover that can't be measured until the image is loaded, and you have no call to adjustForContent(), which is required when doing this kind of thing. It's not clear why Chrome appears to work; possibly Chrome is caching the images and Firefox is not.

So you should keep your approach of getting the sizes for the image and writing them into the HTML; that's a correct approach.