This is a migrated thread and some comments may be shown as answers.

Toolbar css difference

1 Answer 83 Views
Grid
This is a migrated thread and some comments may be shown as answers.
Wim
Top achievements
Rank 1
Wim asked on 21 Jan 2021, 07:25 AM

Hello

Since the latest version float-right is no longer working in the ToolBar of the Grid and the ToolBar disappears sometimes.

The disappearance if the Grid does not happen with <link href="_content/Telerik.UI.for.Blazor/css/kendo-theme-bootstrap/all.css" rel="stylesheet" /> but the float-right does not work.

When I use the Sass Theme builder, there are differences in the css and the ToolBar disappears sometimes.

For example the standard bootstrap css has:

.k-grid-toolbar {
border-width: 0 0 1px;
-ms-flex-negative: 0;
flex-shrink: 0;
}

And the generated css has this but is not set on the toolbar:

 .k-toolbar > * {
        -ms-flex-negative: 0;
        flex-shrink: 0;
        display: -ms-inline-flexbox;
        display: inline-flex;
        -ms-flex-align: stretch;
        align-items: stretch;
        -ms-flex-line-pack: center;
        align-content: center;
        vertical-align: middle
    }

Is the generated css updated to the latest version and why does the float-right not work?

 

1 Answer, 1 is accepted

Sort by
0
Accepted
Svetoslav Dimitrov
Telerik team
answered on 21 Jan 2021, 07:35 AM

Hello Wim,

As part of our 2.21.0 release, we have made an enhancement for the SearchBox where it can be positioned to the left as well. The default value in the CSS is to place it to the left side so we have updated the documentation and the demo to show how to place it back to the right-hand side.  

Code snippet:

    <GridToolBar>
        <span class="k-toolbar-spacer"></span> @* add this spacer to keep the searchbox on the right *@
        <GridSearchBox />
    </GridToolBar>

Regards,
Svetoslav Dimitrov
Progress Telerik

Virtual Classroom, the free self-paced technical training that gets you up to speed with Telerik and Kendo UI products quickly just got a fresh new look + new and improved content including a brand new Blazor course! Check it out at https://learn.telerik.com/.

Tags
Grid
Asked by
Wim
Top achievements
Rank 1
Answers by
Svetoslav Dimitrov
Telerik team
Share this question
or