[Solved] First level of items width 100%

[Peter Zolja]

Hi,

I'm trying to do something I consider easy, but it turns out to be not so easy. I have a div that has a certain width (may vary). I'm trying to put a (vertical) menu in this div. All the items in the first level (the ones that are visible by default) should stretch to 100% of the container (in this case a div).

Setting the width for the RadMenu to 100% makes the menu stretch, but the items are not following along (they remain the same width as before, I'm guessing the width set by the item's text content). How can I make the items stretch as well?

Thanks.

P.S. I'm using a custom skin so changing the css would be OK, but I need to know what to change.

[Peter Zolja]

I guess it was easy after all :) I had to change this:

.RadMenu_Default .rmVertical .rmItem { border-bottom: 1px solid #353535; }

to this:

.RadMenu_Default .rmVertical .rmItem { width:100%; border-bottom: 1px solid #353535; }

[Peter Zolja]

Spoke too soon; but this should be in RadMenu not Editor -- sorry.

[Peter]

Hi Peter,

Since the <li> element with .rmItem class wraps the link ement with .rmLink class you need to set the width property to 100% for both classes:

.rmLink, .rmItem
    {
        width: 100%;
    }

Greetings,
Peter
the Telerik team

Instantly find answers to your questions at the new Telerik Support Center