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

5 posts, 0 answers
  1. Patrick
    Patrick avatar
    19 posts
    Member since:
    Jun 2013

    Posted 20 Mar 2015 Link to this post

    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?
  2. Dimitar
    Admin
    Dimitar avatar
    281 posts

    Posted 21 Mar 2015 Link to this post

    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
  3. UI for ASP.NET Ajax is Ready for VS 2017
  4. Patrick
    Patrick avatar
    19 posts
    Member since:
    Jun 2013

    Posted 23 Mar 2015 in reply to Dimitar Link to this post

    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.

  5. Dimitar
    Admin
    Dimitar avatar
    281 posts

    Posted 23 Mar 2015 Link to this post

    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
  6. Patrick
    Patrick avatar
    19 posts
    Member since:
    Jun 2013

    Posted 23 Mar 2015 in reply to Dimitar Link to this post

    That did the trick! 
    Thank you!
Back to Top
UI for ASP.NET Ajax is Ready for VS 2017