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

Wizard width really narrow. How can I change to fill screen?

4 Answers 238 Views
Wizard
This is a migrated thread and some comments may be shown as answers.
Patrick
Top achievements
Rank 1
Patrick asked on 20 Mar 2015, 07:09 PM
I am attaching a web page screen shot including the developer tool.
When I highlight the RadWizard control in the DOM explorer, you can see the width shows "0px" (right hand column under "InLine style")
If I modify that width in the developer tool to 90% then the control expands as I would expect to fill the page.   Can you tell me how I can set that width specifically in the aspx page or the code behind so the control is not so narrow?  Hopefully bypass whatever other class/style that is causing this?

4 Answers, 1 is accepted

Sort by
0
Dimitar
Telerik team
answered on 21 Mar 2015, 01:43 PM
Hi,

You can use the RadWizard Width property to set the width of the control. It is visible from your screenshot that the width is 0px, because it was set to 0px, either in the RadWizard markup or in the code behind.
Either way, you should check where the 0px value is set and change it to whatever value you need.

Also if you set the Width in %, e.g. Width="100%", the RadWizard's width would be responsive, depending on the window size. You could see this on the RadWizard mobile Overview demo by resizing the browser window.

Regards,
Dimitar
Telerik
0
Patrick
Top achievements
Rank 1
answered on 23 Mar 2015, 12:35 PM
I tried setting the width to 100% however the control still remains narrow.  I suspect the control is being influenced by other css styles from our main master page since I can isolate the page from any master page and the RadWizard has the correct (full screen) width.  I was hoping that you could tell me the specific css setting which would allow me to override whatever other css style is affecting the width.

0
Dimitar
Telerik team
answered on 23 Mar 2015, 01:04 PM
Hi,

You could override the RadWizard width with the following CSS:

html .RadWizard {
    width: 500px;
}

If this selector is not strong enough, you could use the rule with !important:

html .RadWizard {
    width: 500px !important;
}

Regards,
Dimitar
Telerik
0
Patrick
Top achievements
Rank 1
answered on 23 Mar 2015, 01:16 PM
That did the trick! 
Thank you!
Tags
Wizard
Asked by
Patrick
Top achievements
Rank 1
Answers by
Dimitar
Telerik team
Patrick
Top achievements
Rank 1
Share this question
or