Fixed Grid Column Widths/Row Heights

[Peter.Greulich]

The WAS likes to dynamically adjust Column Widths/Row Heights depending upon the field contents. I want to fix the W + H. Seems like this should be a simple setting, but apparently not?

Is there a way?

[Steve Wood]

You fix the width of the overall grid under Properties / Table Tag Attributes. Just put in "width=xxx" where xxx is your width in pixels.

If you added Layout Commands / Tab Control, the width is set under Sizing in the tab control - but this is only the tab area within the overall grid, so it should be set something smaller than your overall grid with.

Text boxes are set by the Size attribute, lables are set by the Label In-line Style and the Heading Inline Style (need both) otherwise it automatically sets to the size of the heading. Format here is "width: xxx" where xxx is in pixels.

Height is set here too, format for both is: "height: x; width: x". If you set height for one field, this sets the height for all fields.

[Peter.Greulich]

Thanks, Steve. Unfortunately, I have tried that and it does not work. The height still expands and although the width will work for data shorter than the column, longer data cause the column width to expand anyway. I can somewhat control it by using a combination of a trimmed calc field and the width parameter. But even then, it is not perfect, unless I trim the calc field shorther than the column width by trial & error - and even that won't allow me to control the height due to the uncertainty of crlf() in the memo field.

[Lenny Forziati]

This is an HTML limitation - no matter what you specify for height and width, if they are not large enough for the contecnt then your browser will expand the table cell for you.

There is no way to avoid this from the design of your grid or HTML, you will need to trim your data if it is crucial that your cells never expand. And even then, you have no control over the fonts being used by your user's browser so they could have things set to be really large and still be larger than the table cell.

Thanks, Steve. Unfortunately, I have tried that and it does not work. The height still expands and although the width will work for data shorter than the column, longer data cause the column width to expand anyway. I can somewhat control it by using a combination of a trimmed calc field and the width parameter. But even then, it is not perfect, unless I trim the calc field shorther than the column width by trial & error - and even that won't allow me to control the height due to the uncertainty of crlf() in the memo field.

[Peter.Greulich]

Thanks for that clarification, Lenny.

[otto17]

This is an HTML limitation - no matter what you specify for height and width, if they are not large enough for the contecnt then your browser will expand the table cell for you.

There is no way to avoid this from the design of your grid or HTML, you will need to trim your data if it is crucial that your cells never expand. And even then, you have no control over the fonts being used by your user's browser so they could have things set to be really large and still be larger than the table cell.

I also have the issue with height of the grid row (also detail rows). And I am referring not to the field text boxes, but the row area containing the fields.
When I generate the "live preview" the row heights appear as tight as I would like them, but when publishing and then viewing in the browser the row height is over 50% taller than in live preview, but the data cell/text box height remains the same as it was in live preview. The result is that I use up more monitor real estate (top to bottom) than I would like to.
The solution must be in the CSS setting; I have tried to adjust by changing CSS settings, but have not discovered the magic setting. I started with the generic Glass Blue. Thank you for any suggestions.

I have included a side by side example: browser results on the left; live preview on the right.row height - browser vs Live Preview.png

[josevelez]

This limitation has been beyond frustrating... has anyone found a workaround? This seems like something that should be easy to do.

[Steve Wood]

This is the V7 forum, are you recent posters using V7?

Otto, study the web view using Firebug to determine what CSS is being applied to cause the extra space (if any), then adjust either in the grid or using page-level CSS. If you toss that grid up on a public page and give me the URL, I can do it for you. GlassBlue is a legacy style, try updating to a more recent style (unless you really are using V7.)

Jose - which limitation, the one Peter described in the first post and Lenny said was out of Alpha's control and totally dependent on HTML limitations? You can mostly 'defeat' that limitation by truncating your text or using Javascript to dynamically change the font size based on string length (likely not an easy task). As to truncating the text, in the past I have used a function to trim long text to 100 characters and place a "more..." at the end if the string was longer than 100 characters, and the "more..." was a hyperlink to a popup that displayed the full text.

[josevelez]

Try using the white-space property in the Cell in-line style. I set it to normal and it worked for me.

[jocarop]

This is the V7 forum, are you recent posters using V7?

Otto, study the web view using Firebug to determine what CSS is being applied to cause the extra space (if any), then adjust either in the grid or using page-level CSS. If you toss that grid up on a public page and give me the URL, I can do it for you. GlassBlue is a legacy style, try updating to a more recent style (unless you really are using V7.)

Jose - which limitation, the one Peter described in the first post and Lenny said was out of Alpha's control and totally dependent on HTML limitations? You can mostly 'defeat' that limitation by truncating your text or using Javascript to dynamically change the font size based on string length (likely not an easy task). As to truncating the text, in the past I have used a function to trim long text to 100 characters and place a "more..." at the end if the string was longer than 100 characters, and the "more..." was a hyperlink to a popup that displayed the full text.

Hi,

In which event or where did you place the Javascript to truncate the text and display the hyperlink? I have not been able to truncate the tex without changing the field value.


Thanks,

Jose

[CharlesParker]

I was wondering the same thing Steve (about the "more" link) and yeah I am in V12 - far cry from 7 in fact I have never seen v7.
What I really wanna know is if Steve has a book coming out on all his tips and tricks, lol !!!