How to align images in the middle of the cell?

Hi,

Is there a way to vertically align images in the middle of the cell? All images are aligned to the top and I haven't found a solution yet.

Any tips are appreciated!

Thanks,

Steph

I've been thinking of a solution... Can we force the valign='middle' using CSS? If so, how do we do this?

Thanks!

as far as I know css dosn't support valign appart for text related align

stuff it in a table lol (I know ugly hack)

If your images are aligned to the top then most likely you have the following line in the css:

.active-box-image {height: 16px;} /* for firefox 0.8 */

You should remove this line as it is no longer needed (since 1.0.1). This should put your images in the middle. You may also adjust line height to put text in the middle as well:

.active-grid-row {height: 40px;}
.active-row-cell {line-height: 40px;}

I checked and I don't have this line. In fact, I'm using the code in the basic.htm file provided in your examples. Is there anything wrong? somthing I have to add?

Thanks,

Steph

<title>ActiveWidgets Grid :: Examples</title>
    <style> body, html {margin:0px; padding: 0px; overflow: hidden;} </style>

    <!-- ActiveWidgets stylesheet and scripts -->
    <link href="../../runtime/styles/xp/grid.css" rel="stylesheet" type="text/css" ></link>
    <script src="../../runtime/lib/grid.js"></script>

    <!-- grid format -->
    <style>
        .active-controls-grid {height: 100%; font: menu;}

        .active-column-0 {width:  80px;}
        .active-column-1 {width: 200px;}
        .active-column-2 {text-align: right;}
        .active-column-3 {text-align: right;}
        .active-column-4 {text-align: right;}

        .active-grid-column {border-right: 1px solid threedlightshadow;}
        .active-grid-row {border-bottom: 1px solid threedlightshadow;}
    </style>