To resolve the NullPointerException, you need to identify the variable…

Question

Ghulam Nabi

Asked: August 7, 20222022-08-07T10:05:50+00:00 2022-08-07T10:05:50+00:00

Internal styling in Maui Blazor Hybrid apps

How to use internal styling in Maui Blazor Hybrid apps? My code follows.

The background-color stying is ignored.

    @page "/"
    <style>
        background-color : blue;
    </style>
    <h1>Hello, world!</h1>
    CoderGuy {
    
    }

You must login to add an answer.

Need An Account,

Kane Williamson · Answer 1 · 2022-08-07T10:06:42+00:00

It’s ignored because it’s not valid css.

You can either use inline style:

<h1 style="background-color: blue;">Hello, world!</h1>

Or define a css class:

<style>
    .bg-blue {
        background-color: blue;
    }
</style>

<h1 class="bg-blue">Hello, world!</h1>

But it’s not good idea to add style tag inside razor component like that.

You should use “css isolation” which is a blazor feature.

Index.razor:

@page "/"

<h1 class="header">Hello, world!</h1>

CoderGuy {

}

Create Index.razor.css:

.header {
    background-color: blue;
}