How to remove Wrapped item text space

5 posts, 0 answers
  1. Vivek Kumar
    Vivek Kumar avatar
    6 posts
    Member since:
    Mar 2010

    Posted 18 Mar 2010 Link to this post

    Hi ,
    I am Using this CSS. 
    Below is code for CSS.
    we want to remove the wrapped item text space. for more refernece see scennshot.

    <dnn:RadMenu  ID="RadMain_Menu" Width="198px" runat="server" Flow="vertical" SelectedPathHeaderItemCss="focused"
                                                EnableEmbeddedSkins="false"  ShowPath="true" CssClass="RadMenu_Skin"
                                                Skin="" EnableViewState="false"  GroupOffsetX="8" GroupOffsetY="4"   Wrap="false"  SelectedPathItemCss="focused">
       </dnn:RadMenu>

    And CSS.




    .RadMenu_Skin .expandRight
    {
    background: transparent url( "../images/arrow.png" ) no-repeat right center; /*background: transparent url("/GSBADNN/arrow.png") no-repeat right center;*/
    background-color: transparent;
    }

    .RadMenu_Skin .rmLink rmExpanded
    {
    background: transparent url( "../images/arrow.png" ) no-repeat right center; /*background: transparent url("/GSBADNN/arrow.png") no-repeat right center;*/
    background-color: transparent;
    }
    .RadMenu_Skin .rmText rmExpandRight
    {
    /*background: transparent url("/GSBADNN/arrow.png") no-repeat right center;*/
    background: transparent url( "../images/arrow.png" ) no-repeat right center;
    background-color: transparent;
    }

    .RadMenu_Skin .rmLevel1 .rmLink
    {
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=78)";
    filter: alpha(opacity=78);
    opacity: 0.78;
    -moz-opacity: 0.78;
    white-space:normal !important;  
        float:none !important;  
        position:inherit;  
    }

    .RadMenu_Skin .group .text {
        padding:3px 10px 5px;
    }
    /*Space Between root items and child items menu */
     


    /*focused menu item color */.RadMenu_Skin a.focused
    {
    background-color: #34C6F9;
    }
    .RadMenu_Skin .rmRootGroup
    {
    }
    .RadMenu_Skin .rmLink
    {
    border: 1px solid white;
    border-bottom: 0;
    border-left: 0;
    border-right: 0;
    height: auto;
    width: auto;
    }
    .RadMenu_Skin .rmText
    {
    padding-left: 5px; 
    width: 198px;
    padding-right: 5px; 
    margin-left: 0px;
    left: 0px;
    }
    .RadMenu_Skin .rmLeftArrow, .RadMenu_Skin .rmRightArrow, .RadMenu_Skin .rmTopArrow, .RadMenu_Skin .rmBottomArrow
    {
    background: transparent url( "../images/arrow.png" ) no-repeat right center; /*background: transparent url("/GSBADNN/arrow.png") no-repeat right center;*/
    background-color: transparent;
    }
    .RadMenu_Skin .rmRootGroup
    {
    border: 1px solid #3d556c;
    background-color: #627f97;
    }
    .RadMenu_Skin .rmHorizontal
    {
    background-position: 0 0;
    background-repeat: repeat-x;
    }
    .RadMenu_Skin .rmVertical
    {
    background-position: 0 -425px;
    background-repeat: repeat-x;
    }
    /* <Root items> */.RadMenu_Skin, .RadMenu_Skin .rmLink
    {
    font: normal 10pt/23pt "Verdana" , Verdana, Verdana;
    text-decoration: none;
    }
    .RadMenu_Skin .rmLink
    {
    color: #fff;
    }
    .RadMenu_Skin .rmLink, .RadMenu_Skin .rmText
    {
    background-position: 0 1050px;
    background-repeat: no-repeat;
    height:auto;
    }
    .RadMenu_Skin .rmLink:hover
    {
    text-decoration: none;
    cursor: pointer; /* background: transparent url("http://localhost/gsbadnn/arrow.png") no-repeat right center; */
    }
    .RadMenu_Skin .rmFocused, .RadMenu_Skin .rmSelected
    {
    color: #0d202b;
    background-position: 0 -72px;
    }

    .RadMenu_Skin .rmLeftArrow, .RadMenu_Skin .rmRightArrow, .RadMenu_Skin .rmTopArrow, .RadMenu_Skin .rmBottomArrow
    {
    background: transparent url( "../images/arrow.png" ) no-repeat right center; /*background: transparent url("/GSBADNN/arrow.png") no-repeat right center;*/
    background-color: transparent;
    }
    .RadMenu_Skin .rmLink:hover .rmText, .RadMenu_Skin .rmFocused .rmText, .RadMenu_Skin .rmSelected .rmText
    {
    background-position: 100% -96px;
    }
    .RadMenu_Skin .rmExpanded, .RadMenu_Skin .rmExpanded:hover
    {
    /*color: #0d202b;*/
    background-position: 0 -120px;
    }
    .RadMenu_Skin .rmExpanded .rmText, .RadMenu_Skin .rmExpanded:hover .rmText
    {
    background-position: 100% -144px;
    }
    .RadMenu_Skin .rmDisabled, .RadMenu_Skin .rmDisabled:hover
    {
    color: #aaa;
    }
    .RadMenu_Skin .rmDisabled:hover, .RadMenu_Skin .rmDisabled:hover .rmText
    {
    background: none;
    }
    /* </Root items> *//* <Submenu items> */.RadMenu_Skin .rmGroup, .RadMenu_Skin .rmMultiColumn, .RadMenu_Skin .rmGroup .rmVertical
    {
    border: 1px solid #768ca5;
    margin:0 0 0 0px;
    padding:0 0px 0 0px;
    }
    .RadMenu_Skin .rmSlide .rmScrollWrap
    {
    background-image: none;
    }
    .RadMenu_Skin_rtl .rmGroup, .RadMenu_Skin_rtl .rmMultiColumn, .RadMenu_Skin_rtl .rmGroup .rmVertical
    {
    background-position: 100% 0;
    margin:0 0 0 0px;
    padding:0 0px 0 0px;
    }
    .RadMenu_Skin .rmGroup .rmLink
    {
    /* color: #000;*/
    margin:0 0 0 0px;
    padding:0 0px 0 0px;
    }
    .RadMenu_Skin .rmGroup .rmLink:hover, .RadMenu_Skin .rmGroup .rmFocused, .RadMenu_Skin .rmGroup .rmSelected
    {
        margin:0 0 0 0px;
    padding:0 0px 0 0px;
    }
    .RadMenu_Skin .rmRootGroup .rmHorizontal
    {
    background-image: none;
    margin:0 0 0 0px;
    padding:0 0px 0 0px;
    }
    .RadMenu_Skin .rmScrollWrap .rmVertical
    {
    border: 0;
    }
    .RadMenu_Skin .rmGroup .rmFirst, .RadMenu_Skin .rmGroup .rmLast
    {
    background: none;
    margin:0 0 0 0px;
    padding:0 0px 0 0px;
    }
    .RadMenu_Skin .rmGroup .rmLast
    {
    padding-bottom: 1px;
    }
    .RadMenu_Skin .rmGroup .rmLink:hover, .RadMenu_Skin .rmGroup .rmFocused, .RadMenu_Skin .rmGroup .rmSelected, .RadMenu_Skin .rmGroup .rmExpanded
    {
    background-position: 0 -168px;
    margin:0 0 0 0px;
    padding:0 0px 0 0px;
    }
    .RadMenu_Skin .rmGroup .rmLink:hover .rmText, .RadMenu_Skin .rmGroup .rmFocused .rmText, .RadMenu_Skin .rmGroup .rmSelected .rmText, .RadMenu_Skin .rmGroup .rmExpanded .rmText
    {
    background-position: 100% -192px;
    }
    .RadMenu_Skin .rmGroup .rmDisabled, .RadMenu_Skin .rmGroup .rmDisabled:hover
    {
    color: #aaa;
    }
    /* <expand arrows> */.RadMenu_Skin .rmGroup .rmExpandRight
    {
    height: auto;
    background: transparent url( "../images/arrow.png" ) no-repeat right center; /*background: transparent url("/GSBADNN/arrow.png") no-repeat right center;*/
    }
    .RadMenu_Skin .rmGroup .rmExpandRight:hover
    {
    background-color: #001C4E;
    }
    .RadMenu_Skin .rmGroup .rmExpandDown
    {
    background-position: 100% -216px;
    }
    .RadMenu_Skin_rtl .rmGroup .rmItem .rmLink .rmText
    {
    background: transparent url( "../images/arrow.png" ) no-repeat right center; /*background: transparent url("/GSBADNN/arrow.png") no-repeat right center;*/
    }
    .RadMenu_Skin .rmGroup .rmLink:hover .rmExpandRight, .RadMenu_Skin .rmGroup .rmFocused .rmExpandRight, .RadMenu_Skin .rmGroup .rmSelected .rmExpandRight, .RadMenu_Skin .rmGroup .rmExpanded .rmExpandRight, .RadMenu_Skin .rmGroup .rmLink:hover .rmExpandDown, .RadMenu_Skin .rmGroup .rmFocused .rmExpandDown, .RadMenu_Skin .rmGroup .rmSelected .rmExpandDown, .RadMenu_Skin .rmGroup .rmExpanded .rmExpandDown
    {
    background-position: 100% -240px;
    }
    .RadMenu_Skin .rmGroup .rmDisabled:hover .rmExpandRight, .RadMenu_Skin .rmGroup .rmDisabled:hover .rmExpandDown
    {
    /*background-image: url('/../../../..arrow.png');*/
    background-position: 100% -216px; /*background: transparent url("/GSBADNN/arrow.png") no-repeat right center;*/
    background: transparent url( "../images/arrow.png" ) no-repeat right center;
    }
    /* </expand arrows> *//* <rtl> */.RadMenu_Skin_rtl .rmGroup .rmLink:hover, .RadMenu_Skin_rtl .rmGroup .rmFocused, .RadMenu_Skin_rtl .rmGroup .rmSelected, .RadMenu_Skin_rtl .rmGroup .rmExpanded
    {
    background-position: 100% -264px;
    }
    .RadMenu_Skin_rtl .rmGroup .rmLink:hover .rmText, .RadMenu_Skin_rtl .rmGroup .rmFocused .rmText, .RadMenu_Skin_rtl .rmGroup .rmSelected .rmText, .RadMenu_Skin_rtl .rmGroup .rmExpanded .rmText
    {
    background-position: 0 -288px;
    }
    .RadMenu_Skin_rtl .rmGroup .rmExpandLeft
    {
    background-position: 0 -312px;
    }
    .RadMenu_Skin_rtl .rmGroup .rmLink:hover .rmExpandLeft, .RadMenu_Skin_rtl .rmGroup .rmFocused .rmExpandLeft, .RadMenu_Skin_rtl .rmGroup .rmSelected .rmExpandLeft, .RadMenu_Skin_rtl .rmGroup .rmExpanded .rmExpandLeft
    {
    background-position: 0 -336px;
    }
    .RadMenu_Skin_rtl .rmItem .rmExpanded, .RadMenu_Skin_rtl .rmItem .rmExpanded:hover
    {
    background: transparent url( "../images/arrow.png" ) no-repeat right center; /*background:border: 1px solid white;     border-bottom: 0;     border-left: 0;     border-right: 0;*/ /*background: transparent url("/GSBADNN/arrow.png") no-repeat right center; background:border: 1px solid white;     border-bottom: 0;     border-left: 0;     border-right: 0;*/
    }
    /* </rtl> *//* </Submenu items> *//* <Submenu offsets (WebBlue - specific, overlapping submenus)> */.RadMenu_Skin .rmSlide
    {
    margin: -3px 0 0 1px;
    }
    .RadMenu_Skin .rmVertical .rmSlide, .RadMenu_Skin .rmSlide .rmSlide, .RadMenu_Skin_Context .rmGroup .rmSlide
    {
    margin: 0 0 0 -5px;
    }
    .RadMenu_Skin_rtl .rmSlide
    {
    margin: -3px 0 0 -1px;
    }
    .RadMenu_Skin_rtl .rmVertical .rmSlide, .RadMenu_Skin_rtl .rmSlide .rmSlide, .RadMenu_Skin_Context_rtl .rmGroup .rmSlide
    {
    margin: 0 0 0 5px;
    }
    /* </Submenu offsets> *//* <Scrolling arrows> */.RadMenu_Skin .rmLeftArrow, .RadMenu_Skin .rmRightArrow
    {
    background-color: #E0E5F5;
    margin-left: 10px;
    }
    .RadMenu_Skin .rmLeftArrow
    {
    background-position: -8px -312px;
    border-right: 1px solid #B7BDCD;
    }
    .RadMenu_Skin .rmRightArrow
    {
    background-position: -482px -216px;
    border-left: 1px solid #B7BDCD;
    }
    .RadMenu_Skin .rmTopArrow, .RadMenu_Skin .rmBottomArrow, .RadMenu_Skin .rmGroup .rmLeftArrow, .RadMenu_Skin .rmGroup .rmRightArrow
    {
    background-color: #f0f0f0;
    }
    .RadMenu_Skin .rmTopArrow
    {
    background-position: 50% -367px;
    border-bottom: 1px solid #B7BDCD;
    }
    .RadMenu_Skin .rmBottomArrow
    {
    background-position: 50% -391px;
    border-top: 1px solid #B7BDCD;
    }
    /* </Scrolling arrows> *//* <Separators> */.RadMenu_Skin .rmVertical .rmSeparator .rmText
    {
    background-position: 0 -406px;
    }
    .RadMenu_Skin_Context .rmVertical .rmSeparator .rmText, .RadMenu_Skin .rmVertical .rmVertical .rmSeparator .rmText, .RadMenu_Skin .rmHorizontal .rmVertical .rmSeparator .rmText
    {
    background-position: 0 -408px;
    }
    .RadMenu_Skin .rmHorizontal .rmSeparator .rmText, .RadMenu_Skin .rmVertical .rmHorizontal .rmSeparator .rmText
    {
    background-position: 0 -386px;
    }
    /* </Separators> *//* </RadMenu / WebBlue> */div.RadMenu_Skin
    {
    background-color: rgb(255, 255, 255);
    }
    div.RadMenu_Skin .rmItem .rmLink
    {
    background-color: #001C4E;
    background-image: url( "../images/MenuBack.jpg" ); /*background-image: url("/GSBADNN/MenuBack.jpg");*/
    background-position: top;
    background-repeat: repeat-x;
    border: 1px solid white;
    border-bottom: 0;
    border-left: 0;
    border-right: 0;
    height: auto;
    }
    div.RadMenu_Skin .rmItem .rmLink:hover
    {
    background-color: rgb(52, 198, 249);
    }
    div.RadMenu_Skin > .rmVertical .rmLink .rmExpandRight
    {
    }
    div.RadMenu_Skin .rmItem .rmGroup
    {
     background: none; 
    }
    /* Rad Menu subitem */div.RadMenu_Skin .rmGroup .rmItem .rmLink
    {
    background-color: #34C6F9;
    background-image: url( "../images/Menu_Hover_Back.png" ); /*background-image: url("/GSBADNN/Menu_Hover_Back.png");*/
    color: Black;
    }
    div.RadMenu_Skin .rmGroup .rmItem .rmLink:hover
    {
    background-color: rgb(1, 31, 81);
    color: White;
    }
    .RadMenu_Skin .rmItem .rmLink:hover
    {
    }
    .RadMenu_Skin .rmItem .rmFocused, .RadMenu_Skin .rmItem .rmSelected
    {
    border: 1px solid white;
    border-bottom: 0;
    border-left: 0;
    border-right: 0;
    height:  auto;
    }
    .RadMenu_Skin ul.rmRootGroup, .RadMenu_Skin div.rmRootGroup
    {
    border: 1px solid white;
    background-color: white;
    border-top: none !important;
    border-bottom: none !important;
    }
    .RadMenu_Skin .rmGroup
    {
    border-top: none !important;
    border-bottom: none !important;
    }
    .RadMenu_Skin .rmItem .rmExpanded:hover
    {
    /*background:border: 1px solid white;     border-bottom: 0;     border-left: 0;     border-right: 0;*/
    }
    .rmItem rmLast
    {
    background-color: #34C6F9;
    }
    /*Selected item CSS Style */
    .RadMenu_Skin .rmLink:hover, .RadMenu_Skin .focused
    {
    color: Black;
    background-image: url( "../images/Menu_Hover_Back.png" ) !important; /*background-image: url("/GSBADNN/Menu_Hover_Back.png")!important;*/
    background-repeat: no-repeat;
    text-decoration: none;
    background: url( "../images/arrow.png" ) no-repeat right center; /*background:  url("/GSBADNN/arrow.png") no-repeat right center;*/
    }

    .RadMenu_Skin a.expanded
    {
    /*background:  url("/GSBADNN/arrow.png") no-repeat right center;*/
    background: url( "../images/arrow.png" ) no-repeat right center;
    }
    div.RadMenu .rmGroup .rmText {
       margin:0 0 0 14px;
       padding:0 0px 0 0px;
       text-align: left;
     }
     
     div.RadMenu .rmGroup  .rmText
    {
        width: 198px !important;
    }

    div.RadMenu .rmRootGroup .rmText 
    {      
        width: 198px !important;  
       padding: 0px; 
       
    }

    Thanks for time and Support.
     Vivek
  2. Yana
    Admin
    Yana avatar
    4850 posts

    Posted 22 Mar 2010 Link to this post

    Hi Vivek Kumar,

    I couldn't test your skin, because of the missed images, but generally you should reduce the line-height of the items with the following css styles:

    div.RadMenu a.rmLink {
      line-height: 15px;
    }

    If that doesn't help, please send us a live url demonstrating the issue.

    Best regards,
    Yana
    the Telerik team

    Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Public Issue Tracking system and vote to affect the priority of the items.
  3. Vivek Kumar
    Vivek Kumar avatar
    6 posts
    Member since:
    Mar 2010

    Posted 22 Mar 2010 Link to this post

    Hi Yana,
    Thanks for the Quick reply.
    I opened a support ticket for this. Please see that.

    Thanks,
    Vivek
  4. Vivek Kumar
    Vivek Kumar avatar
    6 posts
    Member since:
    Mar 2010

    Posted 29 Mar 2010 Link to this post

    Hi Yana,

    I  opened a support ticket for this.

    Could you please look into?

    Thanks,
    Vivek Kumar
  5. Yana
    Admin
    Yana avatar
    4850 posts

    Posted 29 Mar 2010 Link to this post

    Hi Vivek Kumar,

    I've just answered to the support ticket regarding this issue.

    All the best,
    Yana
    the Telerik team

    Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Public Issue Tracking system and vote to affect the priority of the items.
Back to Top