After updating Radzen yesterday having issues with my floating button bar

Radzen Blazor Studio
1

Code that uses button bar

<RadzenTemplateForm @ref=@bTechPage Data="@bTechModel" InvalidSubmit=@OnInvalidSubmit Submit="@(async(BTechModel args) => { await OnSubmitAsync(args);})">

            @* Floating Button Bar *@
            <div class="row button-bar" style="opacity:@ToolbarOpacity">
                <div class="col-md-12 d-flex align-items-end justify-content-center" style="margin-top: 10px;margin-bottom: 10px;">
                    <RadzenButton Text="Save" ButtonType="ButtonType.Submit" ButtonStyle="ButtonStyle.Light" style="display: inline-block;" Visible=!permitInfo.ReadOnlyMode />
                    <RadzenButton Text="Discard Data" ButtonType="ButtonType.Button" Click="DiscardChanges" ButtonStyle="ButtonStyle.Light" Visible=bTechPage.EditContext.IsModified() style="display: inline-block; margin-left: 10px;" />
                    <RadzenButton Text="No Change" ButtonType="ButtonType.Button" Click="NoChange" ButtonStyle="ButtonStyle.Light" Visible=!bTechPage.EditContext.IsModified() style="display: inline-block; margin-left: 10px;" />
                    <RadzenButton Text="Messages" ButtonType="ButtonType.Button" Click="ProcessMessages" ButtonStyle="ButtonStyle.Light" style="display: inline-block; margin-left: 10px;" Disabled=permitInfo.NewPermit />
                    <RadzenButton Text="Print" ButtonType="ButtonType.Button" Click="OnPrintReadyForm" ButtonStyle="ButtonStyle.Light" style="display: inline-block; margin-left: 10px;" Disabled=bTechModel.New />
                </div>
            </div>

In my custom.css file

.button-bar {
position: sticky;
position: -webkit-sticky; /* Safari */
z-index: 1;
top: 0px;
float: inline-start;
background-color: lightgray;
}

The floating button bar is now to the left of the page, it use to be on top.

I’m wondering if something changed with the styling of class rz-form (which is the nearest block level container).

I have a professional subscription, but unable to find dedicated support.

2

Hi @BillLinck,

We haven't made any changes recently that affect the rz-form class. The last change in the form styling was from a year ago: radzen-blazor/Radzen.Blazor/themes/components/blazor/_form.scss at master · radzenhq/radzen-blazor · GitHub

You can use your browser's developer tools to see what the positioned parent element is. You can also try downgrading the Radzen.Blazor package (if you are using a free theme) to see if the update really changed the appearance.

Dedicated support is available here in the forum and by email - info@radzen.com.