how to use <h2> inside dialog content?

[Indra]

how to use <h2> inside dialog content?

[Indra]

hello?

I really cant change the font size and having h2 or any H inside dialog content. Can somebody help me?

[Revanth Krishnan]

Hi Indra, 

 

 

Greetings from Syncfusion support. 

 

 

We have validated your query “How to use <h2> inside the dialog content? And I really can’t change the font size and having h2 or any H inside dialog content. ” 

 

The <h2> can be used inside the dialog content using the ‘DialogTemplate’. Also, the default font size of the h2 will be applied and the font size can also be changed using the ‘font-size’ CSS class property. We have prepared a sample for your reference, 

 

Code Snippet: 

 

<SfDialog Width="250px" ShowCloseIcon="true" @bind-Visible="@IsVisible"> 

    <DialogTemplates> 

        <Header> Dialog </Header> 

        <Content> 

            <div class="dialogContent"> 

                <h1>H1 dialog content</h1> 

                <h2>H2 dialog tag</h2> 

                <h3>H3 dialog tag</h3> 

                <p>Paragraph dialog tags</p> 

            </div> 

        </Content> 

    </DialogTemplates> 

    <DialogButtons> 

        <DialogButton Content="OK" IsPrimary="true" OnClick="@CloseDialog" /> 

        <DialogButton Content="Cancel" OnClick="@CloseDialog" /> 

    </DialogButtons> 

</SfDialog> 

<style> 

    .dialogContent p { 

        font-size: 20px; 

    } 

    .dialogContent h2 { 

        font-size: 10px; 

    } 

</style> 

 

Sample: https://www.syncfusion.com/downloads/support/forum/163018/ze/Dialog_Blazor_App-1105863237 

 

Please check the above code snippet and the sample and let us know if it satisfies your requirement. 

 

Regards, 

Revanth 

[Indra]

Thank you for your reply. 

My content is inside another page, and inside that page there is table and the table content is in another page. so i got page inside page inside page.

i try your fix, and it work inside original page and layer 2 page. but inside layer 3, it didnt work. and right now i know how, its because im using<H2><B>content</B></H2>

because im using B inside H2. when i delete the <B> it work perfectly as long as im using !important.

how can i style dialog when there is multiple page layer inside the content?

by the way, my problem are solved thanks to the example that you gave me. 

[Revanth Krishnan]

Hi Indra, 

 

Thanks for the update. 

 

We are glad that the reported query has been resolved, please let us know if you need any further assistance. 

 

Regards, 

Revanth