nav[aria-label="Primary Navigation"] { padding: 0; & ul { list-style: none; width: 100%; display: flex; flex-direction: row; justify-content: start; align-items: start; gap: 30px; padding: 0; & li { margin: 0; } & ul li { list-style: none; } } }

Problem with layout while creating Stack Column

shahamar

Hi,

I am trying to create Report with Stack Column (i.e show multiple dataset columns in same table column one below other).

We have very specific and simple requirement for the layout
1. Each column lable appears in grey background with white border
2. Stacked can be of any number of column most commonly 2 or 3 column. but rare case could be 4 column as well.

I have attached report design which demonstrate my current implementation which gives output as attached screen shot.

Specifically when we have combination of 3 stacked column and 2 stacked column in same layout, I see 2 stacked column header is not occupying 100% space in cell.

I am using grid within cell to layout column header. And for 2 stacked column I tried setting grid height to 100% and Row Height each as 50% still it is not helping. I am not able to provide height to Label or Dynamic Text etc. Also I guess absoulte height in terms of inch or cms may not work as column header row height may vary based on the length of column label.

Find more posts tagged with

Comments

shahamar

Any one has idea on how to resolve this issue with layout of stacked column.

shahamar

Any one who can take take a look at my problem. Seems like simple layout problem but not finding any way to resolve it. Any way to to force the Grid to occupy 100% area in Table Cell where it is added? Appreciate your inputs.

fmakwsi

What are your table options on general? got no time to take a look on yours

shahamar

Table has 100% width propertyCell in which Grid has no width or height propertyGrid is set as 100% height2 row each in Grid is set as 50% height

fmakwsi

will take a look on it on the weekend if its ok?

kclark

If your just trying to make sure the grid takes up all of the available space you could try something like this: In the cell the grid is inside of you could do something like this from the onCreate()<pre class="_prettyXprint _lang-">reportContext.setPersistentGlobalVariable("height", this.height);</pre>Then from the onCreate() of the grid<pre class="_prettyXprint _lang-">this.height = reportContext.getPersistentGlobalVariable("height")</pre>