Radzen editor screen vs. web screen


Is there a way to scale the editorscreen to the resolution of the application in the browser? For example, I want to place this colomn with button on the bottem of the screen (see picture)

but it's coming only on 3/4th of the page as you can see in the picture.

I've learned a thing or two regarding vertical and horizontal alignment but I can't seem to fix this issue.

It would be great if you can scroll the editor screen or even zoom in and out so you can cover the whole resolution.

I assume there is no way to make the editor screen bigger?

No, there is no way to make the editor screen bigger at the moment. I am once again sharing my opinion that you should not to use absolute positioning for layouts as it will not work on any other resolution (including Radzen's design time, mobile devices or just users with different screen size). If you insist on using absolute positioning then I am afraid we won't be able to support you any further - you will have to deal with all the limitations of absolute positioning on your own.

I'm actually trying to get rid of the absolute positioning because I see now that it doesn't work on every resolution. What kind of positioning for components do you recommend to use? I guess that static or relative is the best option here.

We recommend using the default Main layout that is created with every Radzen application and customizing it per your needs.

The default positions are as follows:

Header, Sidebar and Footer used fixed position so they don't scroll with the page. Note that the position of those components appear in design time as "absolute". This happens because Radzen overrides it in design time in order to allow the user to scroll normally while developing the page.

The Header has Top set to 0.
The Sidebar has Left set to 0, top set to the height of the Header and Bottom set to the height of the Footer
The footer has bottom set to 0.

Body uses static position. It also relies on margins to compensate for the Header, Footer and Sidebar. Top margin is set to the height of the Header, Bottom margin is set to the height of the Footer and Left margin is set to the width of the Sidebar.

1 Like