Save screen space

[daveb]

I am trying to find a way to place the filter and export buttons as well as the search criteria and button on one line to minimize the space taken on the screen. Can anyone explain if this is possible?

I assume that the code would be in Page_Renderinng., or perhaps Page_Load.

[arbei]

You may try add your own CSS styles (e.g. display) to the <div> tags of them, see:

• Inspect HTML element and add your own CSS styles
• display

[philmills]

I moved my toolbar to top right below the breadcrumbs by overriding .btn-toolbar class in user styles (HTML>Styles>User):

.btn-toolbar { 
   display: flex;
    flex-wrap: wrap;
    justify-content: flex-start;
    position: absolute;
    top: 125px;
    right: 20px;
}

modify top and right to suit your site
Be aware that you need to keep your search section narrow (don't put too many items on one row) so that they don't collide on smaller screens

If you want to just fly the buttons over the right instead of left you can use flex-end:

.btn-toolbar { 
   display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
}

[daveb]

Will moving the toolbar to the right also result in the search criteria being higher on the page?

Also, can you explain where to put the code you showed?

Thanks

[mobhar]

daveb wrote:

Also, can you explain where to put the code you showed?

philmills wrote:

in user styles (HTML>Styles>User)

[daveb]

Works great. Thank you