Alignment of two browse forms side by side

[DonnEdwards]

In my NTWS app I have a memory form that has two browse forms as procedures, next to one another.

When there are plenty of rows, the browse forms line up correctly with the top of each form at the same height.

But when one of the browses has only a few records, the tops of the form no longer line up, as shown in the screen shot. It's like a vertical centre alignment, instead of top alignment.

Note: these are not Child forms. They are two separate tables that I need to compare side by side to match up corresponding pairs. Do I need to start messing with CSS styles to fix this?

I think the styles are .nt-form-flex-row, .nt-form-grid-row but I don't want to mess with stuff I don't yet understand.

All suggestions welcome.

[Jane]

Yes, you do.   

If you're going to do ANYTHING with web apps, Donn, you need to plan to bite the bullet and spend some time getting a basic understanding of CSS.

Because cascading style sheets "cascade", you don't need to mess with Bruce's stuff.

Rather, your own custom CSS file can override any of his CSS settings that you need to.
And you can also specify custom CSS class elements for most of the stuff you put on a screen with NetTalk.  By adding your own class to something, you don't even need to override Bruce's (which might affect multiple places in your app).

There've been innumerable webinars where Bruce has shown how to use the Developer Tools in Chrome or other browsers to experiment with getting the look you want, then putting that little bit of CSS into your own file.  You might look at some recordings or bring this screen to the next Thursday webinar and have him show you how to approach it.

In my as-always ever-so-humble opinion....   

Jane

[DonnEdwards]

Thanks Jane

I have seen Bruce demonstrate experimenting with CSS using the Google Chrome inspect tool. And I have designed my own button for this particular app. I was just hoping there would be a setting somewhere in the multitude of NT options that would fix the problem without having to go through the CSS exercise.

If I haven't fixed it by next week I'll see if I can raise the question at the NT webinar.

Thanks for your support and encouragement
Donn

[DonnEdwards]

I added the following property: align-items: flex-start;
to the following CSS

.nt-form-flex-row,.nt-form-grid-row{
   align-items: flex-start;
}