list row vertical alignment

[frankbicknell]

Does anyone know where I can set the vertical alignment for a lists row?
I have a list where some of the field in the list have multi-line text.
The row shows as bottom aligned. I would like to change that to top aligned.
I have inserted vertical-align: top; in every style property I can find. I have modified the css to have top align for the list items but the rows are still aligned to the bottom.
When I examine the html in firebug it shows a div for each field on each row that has a class definition that seems to be dynamic as it includes the dialog id in the classname.
This is followed by a series of style parameters one of which is vertical-align: bottom;. If i manually override bottom with top in firebug. the row displays the field data aligned to the top as it should.
I can't figure out where I can change these style parameters.

[RichCPT]

Re: list row vertical alignment

Here's a way that will work if your field "Control type" is set to "Label" for the field that you want top-aligned:

In List Builder, click on the "List Events..." hyperlink / label in the bottom of the window.
Select"onItemDraw" event.

For each of the columns that you want to have top-aligned put in code like the following:

var pre = '{dialog.ComponentName}.{dialog.listId}.';
// For each field that you want top aligned....
var e = $(pre + 'YOUR_UPCASED_FIELD_NAME.I.' + index);
if(e && e.parentElement) {
  e.parentElement.style.cssText = e.parentElement.style.cssText + ";vertical-align: top";
}

[RichCPT]

Re: list row vertical alignment

I changed my example code in post # 2 to use placeholders for the UX alias and LIST control. My first post was only good for working preview.

[RichCPT]

Re: list row vertical alignment

Thanks to previous post from David Kates. Simpler way to do this is to include the "!important" css modifier on the "List Layout" tab / "Data in-line style" properties that you don't want Alpha to be able to override. So, List Layout Data in-line style property can be set to:

vertical-align: top !important;

[frankbicknell]

Re: list row vertical alignment

Thank you for your help with this.