cancel
Showing results for 
Search instead for 
Did you mean: 

Sizing of transparent container

0 Kudos

Hi All,

I have the following problem. I have a business graphic inside a transparent container. The business graphic can get quite wide. I would like to limit the width of the container to the witdth of the broser window. If the graphic is wider that the container

a scroll bar should appear in the container.

Now how to set the size of the container to be at most the window size. I do not want to set a fixed width as the width should depend on the window. If I set it to 100% the grafic will determine the container width, and it will become larger than the window causing an horizontal scroll bar in the browser that i don't want. If I set the scroll mode of the container to auto or both, without setting a fixed height or width, I get a zero size container.

Any Ideas?

Thanks,

Reinhold

Accepted Solutions (0)

Answers (2)

Answers (2)

TomVanDoo
Active Contributor
0 Kudos

hmmpff this is a tedious one

I know that in CSS you can do following

position: absolute

left: 0px;

right: 0px;

or

maxwidth: ....

that way the element does not get any bigger than the window (I hope)

however, in WDA you can't change the CSS yourself, unless you change the theme (which is a pain in the ass, so don't go there)

and there are no properties to set the positioning more specific.

what you could do is make the businessgraphic with a dynamic size (width 100%)

that way it will resize itself to fit the window, but you won't have any scrollbars

conclusion: no easy way out

p330068
Active Contributor
0 Kudos

Hi Reinhold,

Use pixel in width/Hight like 500px instead of using %. I think in your case, if you not set the width/hight size, it will work as you wanted. please have a look at [TransparentContainer |http://help.sap.com/saphelp_NW70EHP1/helpdata/en/67/aa884118aa1709e10000000a155106/content] UI Element.

Hope it helps

Regards

Arun

0 Kudos

Hi Arun,

Thanks for the reply. I do not want to use a fixed size in px or ex as I want the size to adpt to the browser window size.

Regards,

Reinhold

ChrisPaine
Active Contributor
0 Kudos

Hi,

have you tried setting it inside a transparent container - setting that container to type grid layout and stretching it setting it to 100%, then inside that another transparent container which you set to width 100%. Set the scrolling mode in the first container.

I had some issue with trays actually filling more that 100% of the screen width - seems like the graphics might do the same?

Good luck,

Chris

p330068
Active Contributor
0 Kudos

Hi Reinhold,

Use the FlowLayout for Transparent Container without any size, it will adopt browser window size. I think it will work.

Hope it helps

Regards

Arun

0 Kudos

Hi Chris,

Yes that is exatly my problem. The grahic is larger than the screen width, causing a horizontal scroll bar for the whole application. I would like to encase the graphic in an area that has its own scroll bar, and covers 100% of the screen width, but ot more.

Unfortunately it does not work for me. I have created the two transparent containers around my graphic . The outer one has a grd layout and its width set to 100%. The inner one also has a width of 100% .

The scrolling attribute of the outer is set to auto.

-> Size of outer container is as large as the graphic, no scroll bars in container

Scroll bars only appear if I set a fixed hight or width for the outer container, which I want to avoid. Or is there any way to determine the browser window width? In that case I could set the container width to the window width..

Thanks for your help,

Reinhold

Edited by: Reinhold Konnerth on Apr 22, 2010 12:27 PM

ChrisPaine
Active Contributor
0 Kudos

Hi Reinhold,

I wish there was a way to get the window width - would have solved my issues with scrolling tables a while back. Unfortunately no such API for this... and given the variety of platforms WD could be rendered on - would even be hard to build an island to return the info.

Have you tried just using a grid layout stretching horizontally, marking as scrolling - not setting the width at all? (you know I really should try this out myself!)

Chris