RadGroup Width

8 posts, 1 answers
  1. July
    July avatar
    205 posts
    Member since:
    Jul 2011

    Posted 31 Oct 2011 Link to this post

    I created the menu programmatically.
    and I've a problem with some witdh of group. I need change the width of somes groups.

    Attach an image

    How I can fix this?
    I try with:
    -  group.Style.add(.....Width, "100px") but does not work.
    - by css .RadRibbonBar .rrbMenuGroupIn {
        padding: 1px 20px 1px 20px;
    }but does not work.

    I need a quickly solution for not change a all code,

    regards
  2. Kate
    Admin
    Kate avatar
    1898 posts

    Posted 02 Nov 2011 Link to this post

    Hello Julieta,

    You could alter the width of the group by using the following css class selector:
    div.RadRibbonBar div.rrbButtonGroup {   width: 100px !important;    }

    Best wishes,
    Kate
    the Telerik team
    If you want to get updates on new releases, tips and tricks and sneak peeks at our product labs directly from the developers working on the RadControls for ASP.NET AJAX, subscribe to their blog feed now
  3. UI for ASP.NET Ajax is Ready for VS 2017
  4. July
    July avatar
    205 posts
    Member since:
    Jul 2011

    Posted 30 Nov 2011 Link to this post

    Thanks kate!
    I need only for specify group.

    I try this

     if(groupTab.Text.ToLower() == "community")   {
                            groupTab.CssClass = "communityWitdh";
      }

    .css:

    .communityWitdh{width: 100px !important}

    But this does not work,

    How I can define this Css for specific group.

    it is posible??
    Thanks
  5. Bozhidar
    Admin
    Bozhidar avatar
    1103 posts

    Posted 02 Dec 2011 Link to this post

    Hi Julieta,

    Since you are creating the ribbon bar programmaticaly, when you create the group, add the following line of code:

    ...
    group2.CssClass = "customGroupWidth";
    tab.Groups.Add(group);
    ...

    Then modify the CSS selector like this:
    div.RadRibbonBar div.rrbButtonGroup.customGroupWidth {   width: 100px !important;    }

    I've also attached a sample page showing how this works.

    All the best,
    Bozhidar
    the Telerik team
    If you want to get updates on new releases, tips and tricks and sneak peeks at our product labs directly from the developers working on the RadControls for ASP.NET AJAX, subscribe to their blog feed now
  6. July
    July avatar
    205 posts
    Member since:
    Jul 2011

    Posted 02 Dec 2011 Link to this post

    Yesssssssss this works!!
    thanks
  7. July
    July avatar
    205 posts
    Member since:
    Jul 2011

    Posted 02 Dec 2011 Link to this post

    Sorry buyt in IE 7/8 Does not work :-(
  8. Answer
    Kate
    Admin
    Kate avatar
    1898 posts

    Posted 07 Dec 2011 Link to this post

    Hello Julieta,

    I encounter the issue that you mention only in IE7, while in IE8 the code provided by Bozhidar works as expected. It seems that only in IE7 the container that holds the RibbonBarGroup does not resize automatically and therefore the RadRibbonBarGroup whose width you need to alter does not take effect. Therefore you will need to resize this contained as well. However, adding the following css class selector you can workaround the issue for IE7:
    * + html div.RadRibbonBar .rrbButtonAreaIn
            {   width: 360px !important;    }

    Greetings,
    Kate
    the Telerik team
    If you want to get updates on new releases, tips and tricks and sneak peeks at our product labs directly from the developers working on the RadControls for ASP.NET AJAX, subscribe to their blog feed now
  9. July
    July avatar
    205 posts
    Member since:
    Jul 2011

    Posted 07 Dec 2011 Link to this post

    Thanks kate!
    This works!
Back to Top
UI for ASP.NET Ajax is Ready for VS 2017