Image vetical align in grid cell

In the grid, how to set the vertical alignment of an image to "top"

I have this

obj.setCellTemplate(new AW.Templates.ImageText, 10);
obj.getCellTemplate(10).setClass("text", "wrap"); 


the image display neatly when I have my cell height set to 20px, but when I increase the cell height, say to 100px, the image will move to the middle. Is there anyway to keep the image on top ?

I have tried

#myGrid .aw-grid-row .aw-column-10 .aw-item-text {vertical-align: top;}

but this only works for text, text will stay on top but image will still shift to middle...
May 30,
In text-wrap mode the image is positioned with float:left rule and top:50%, so you should change it to ~10px -

#myGrid .aw-grid-cell .aw-item-image {top: 10px}
#myGrid .aw-grid-cell .aw-item-text  {vertical-align: top}

(I think the text-wrap only works on row template, i.e.
obj.getRowTemplate().setClass("text", "wrap"); )

Alternatively you can make new text-inline style, where the text goes inline around the image -

obj.getRowTemplate().setClass("text", "inline");

.aw-text-inline .aw-item-image {margin: 1px}
.aw-text-inline .aw-item-ruler {display: none}
Alex (ActiveWidgets)
May 30,
I use your 1st solution and it works. Thanks.
May 30,

This topic is archived.

See also:

Back to support forum