Height attribute of RadWizard

[Jo]

I am not able to change the height for rwzContent

<div class="rwzContent" style="height: 267px;"> 

Please suggest how to change the height of the rwzContent, and is it possible to get vertical scrollbar?

Thanks 

[Nencho]

Hello Jo,

You can use css style rule to modify the rwzContent height with a strong selector. Please consider the below :

<style type="text/css">
       .rwzContent {
            height: 500px !important;
        }
    </style>

In addition, in order to have a scroll in the step content - you would need to have a container, nested in that step, which should have a greater height. For example :

<telerik:RadWizard ID="RadWizard1" runat="server" Height="420px">
            <WizardSteps>
                <telerik:RadWizardStep ID="RadWizardStep1" Title="Step1" runat="server" StepType="Start">
                    <div style="height: 600px;">
                    </div>
                </telerik:RadWizardStep>

Regards,
Nencho
Telerik

[Hari]

Hello Nencho,

Still i am unable to Set Height Statically for rwzContent Class.. 

Any other go ????

[Ivan Danchev]

Hello Hari,

Here's an example:

<telerik:RadWizard ID="RadWizard1" runat="server" RenderMode="Lightweight">
    <WizardSteps>
        <telerik:RadWizardStep ID="RadWizardStep4" StepType="Step" Title="Step1" runat="server">
            <div style="height: 700px; background-color:lightblue;">Step 1</div>
        </telerik:RadWizardStep>
        <telerik:RadWizardStep ID="RadWizardStep3" StepType="Step" Title="Step2" runat="server">
            Step 1
        </telerik:RadWizardStep>
        <telerik:RadWizardStep ID="RadWizardStep1" StepType="Finish" Title="Step3" runat="server">
            Step 1
        </telerik:RadWizardStep>
        <telerik:RadWizardStep ID="RadWizardStep2" runat="server" StepType="Complete">
            Step Complete
        </telerik:RadWizardStep>
    </WizardSteps>
</telerik:RadWizard>

The height of the div in Step 1 is set to 700px. If you apply one of the following two CSS rules the height of corresponding wrapping div element (rwzContent or rwzActive) will be set to 500px and a scroll bar will appear since the Step's content will be higher than its respective wrapping element:

<style>
.RadWizard .rwzContent {
    height: 500px;
}

/*.RadWizard .rwzActive {
    height: 500px;
}*/
</style>

Regards,
Ivan Danchev
Telerik by Progress