padding doesn't apply in ie7

5 posts, 2 answers
  1. hamid bahan
    hamid bahan avatar
    9 posts
    Member since:
    Mar 2010

    Posted 15 May 2010 Link to this post

    i used stylebuilder to generate style for panel  and it works correctly in firfox 3.6.3
    but following style doesn't apply for ie7
    i attached picture  to show diffrenece
    i used  telerik version 2010.1.309.20

    DIV.RadPanelBar_Office2007

     

    .rpRootGroup .rpItem {

     

     

    BACKGROUND-COLOR: #D6E8FF;

     

     

    PADDING-BOTTOM: 7px;

     

    }


    complete css:

     

    .RadPanelBar_Office2007

     

     

     

     

    {

     

    background: #fff;

     

    }

     

     

     

    .RadPanelBar_Office2007

     

    .rpRootGroup

     

     

     

     

     

    {

     

    border-color: #999;

     

    }

     

     

     

    .RadPanelBar_Office2007

     

    .rpLink,

     

     

     

     

    .RadPanelBar_Office2007

     

    .rpTemplate

     

     

     

     

     

    {

     

    color: #000;

     

     

    font: normal 12px/24px tahoma,"Segoe UI", Arial, sans-serif;

     

    }

     

     

     

    .RadPanelBar_Office2007

     

    .rpLink

     

     

     

     

     

    {

     

    background-color: #e4e4e4;

     

     

    border-color: #999;

     

    }

     

    /* compensate for borders */

     

     

     

     

     

    .RadPanelBar_Office2007

     

    .rpLink .rpOut .rpImage

     

     

     

     

     

    {

     

    margin-top:-2px;

     

    }

     

     

     

    .RadPanelBar_Office2007

     

    .rpExpanded

     

     

     

     

     

    {

     

    border-color: #3d556c;

     

    }

     

     

     

    /*-----*/

     

     

     

     

    .RadPanelBar_Office2007

     

    .rpRootGroup .rpSlide .rpGroup .rpItem .rpLink

     

    {

     

    text-indent:2px;

     

    }

     

     

     

     

    .RadPanelBar_Office2007

     

    .rpLink:hover,

     

     

     

     

    .RadPanelBar_Office2007

     

    .rpFocused,

     

     

     

     

    .RadPanelBar_Office2007

     

    .rpSelected

     

     

     

     

     

    {

     

    color: #892500;

     

    }

     

     

     

    .RadPanelBar_Office2007

     

    .rpLink:hover,

     

     

     

     

    .RadPanelBar_Office2007

     

    .rpFocused

     

     

     

     

     

    {

     

    background-color: #ffe79c;

     

     

    border-color: #c98400;

     

    }

     

     

     

    .RadPanelBar_Office2007

     

    .rpSelected,

     

     

     

     

    .RadPanelBar_Office2007

     

    .rpSelected:hover

     

     

     

     

     

    {

     

    background-color: #ffa517;

     

     

    border-color: #ca4b0c;

     

    }

     

     

     

    div.RadPanelBar_Office2007

     

    .rpLink .rpOut,

     

     

     

     

    div.RadPanelBar_Office2007

     

    .rpFocused .rpOut,

     

     

     

     

    div.RadPanelBar_Office2007

     

    .rpLink:hover .rpOut,

     

     

     

     

    div.RadPanelBar_Office2007

     

    .rpSelected .rpOut,

     

     

     

     

    div.RadPanelBar_Office2007

     

    .rpSelected:hover .rpOut

     

     

     

     

     

    {

     

     

    /*padding-bottom: 0px;*/

     

     

     

     

     

     

    border: 0;

     

    }

     

     

     

    /* <disabled items> */

     

     

     

     

    .RadPanelBar_Office2007

     

    .rpDisabled,

     

     

     

     

    .RadPanelBar_Office2007

     

    .rpDisabled:hover

     

     

     

     

     

    {

     

    color: #bbb;

     

     

    background-color: #e4e4e4;

     

     

    border-color: #999;

     

     

    cursor: default;

     

    }

     

     

     

    .RadPanelBar_Office2007

     

    .rpDisabled:hover .rpOut

     

     

     

     

     

    {

     

    border-color: #e4e4e4;

     

    }

     

     

     

    /* </disabled items> */

    /* <expand arrows> */

     

     

     

     

    .RadPanelBar_Office2007

     

    .rpExpandable .rpText,

     

     

     

     

    .RadPanelBar_Office2007

     

    .rpExpanded .rpText

     

     

     

     

     

    {

     

    background-color: transparent;

     

     

    background-image: url('PanelBar/Expandable.png');

     

     

    background-repeat: no-repeat;

     

    }

     

     

     

    /* </expand arrows> */

    /* <subitems> */

     

     

     

     

    .RadPanelBar_Office2007

     

    .rpGroup

     

     

     

     

     

    {

     

    background-color: #d6e8ff;

     

    }

     

     

     

    div.RadPanelBar_Office2007

     

    .rpGroup .rpLink,

     

     

     

     

    div.RadPanelBar_Office2007

     

    .rpGroup .rpTemplate

     

     

     

     

     

    {

     

    color: #000;

     

     

    background-color: transparent;

     

     

    background-image: none;

     

     

    border: 0;

     

     

    margin: 0 2px;

     

     

    padding: 1px;

     

    }

     

     

     

    div.RadPanelBar_Office2007

     

    .rpGroup .rpLink:hover,

     

     

     

     

    div.RadPanelBar_Office2007

     

    .rpGroup .rpFocused,

     

     

     

     

    div.RadPanelBar_Office2007

     

    .rpGroup .rpSelected,

     

     

     

     

    div.RadPanelBar_Office2007

     

    .rpGroup .rpSelected:hover

     

     

     

     

     

    {

     

    color: #892500;

     

     

    border: 1px solid #c98400;

     

     

    background-color: #ffe79c;

     

     

    padding: 0;

     

    }

     

     

     

    div.RadPanelBar_Office2007

     

    .rpGroup .rpSelected

     

     

     

     

     

    {

     

    background-color: #ffa517;

     

     

    border-color: #ca4b0c;

     

    }

     

     

     

    /* <subitems (disabled)> */

     

     

     

     

    div.RadPanelBar_Office2007

     

    .rpGroup .rpDisabled,

     

     

     

     

    div.RadPanelBar_Office2007

     

    .rpGroup .rpDisabled:hover

     

     

     

     

     

    {

     

    color: #bbb;

     

     

    text-decoration: none;

     

     

    background-color: #fff;

     

     

    border: 0;

     

     

    padding: 1px;

     

    }

     

     

     

    /* </subitems (disabled)> */

    /* <subitems> */

    /* <background positioning>

    .RadPanelBar_Office2007 .rpLink,

    .RadPanelBar_Office2007 .rpExpanded

    {

    background-position: 0 0;

    }

    .RadPanelBar_Office2007 .rpFocused,

    .RadPanelBar_Office2007 .rpLink:hover,

    .RadPanelBar_Office2007 .rpExpanded:hover

    {

    background-position: 0 -200px;

    }

    .RadPanelBar_Office2007 .rpSelected,

    .RadPanelBar_Office2007 .rpSelected:hover

    {

    background-position: 0 -400px;

    }

    .RadPanelBar_Office2007 .rpFirst .rpLink,

    .RadPanelBar_Office2007 .rpFirst .rpExpanded

    {

    background-position: 0 -1px;

    }

    .RadPanelBar_Office2007 .rpFirst .rpFocused,

    .RadPanelBar_Office2007 .rpFirst .rpLink:hover

    {

    background-position: 0 -201px;

    }

    .RadPanelBar_Office2007 .rpFirst .rpSelected,

    .RadPanelBar_Office2007 .rpFirst .rpSelected:hover

    {

    background-position: 0 -401px;

    }

    */

    /* <expand arrows> */

     

     

     

     

    .RadPanelBar_Office2007

     

    .rpExpandable .rpText,

     

     

     

     

    .RadPanelBar_Office2007

     

    .rpExpanded .rpText

     

     

     

     

     

    {

     

    padding-right: 20px;

     

     

    background-repeat: no-repeat;

     

    }

     

     

     

     

     

    DIV.RadPanelBar_Office2007 {

     

     

    MARGIN-TOP: 0px;

     

     

    BACKGROUND-COLOR: transparent;

     

    }

     

    DIV.RadPanelBar_Office2007 .rpRootGroup {

     

     

    BORDER-RIGHT: 0px solid;

     

     

    BORDER-TOP: #FFFFFF 0px solid;

     

     

    BORDER-LEFT: 0px solid;

     

     

    BORDER-BOTTOM: 0px solid ;

     

     

    BACKGROUND-COLOR: transparent;

     

    }

     

    DIV.RadPanelBar_Office2007 .rpRootGroup .rpLink {

     

     

    BACKGROUND-POSITION: 0px 0px;

     

     

    BORDER-TOP: #6693CF 1px solid;

     

     

    FONT-WEIGHT: bold;

     

     

    FONT-SIZE: 11px;

     

     

    BACKGROUND-IMAGE: url('PanelBar/item-bg.gif');

     

     

    COLOR: #15428b;

     

     

    LINE-HEIGHT: 18px;

     

     

    text-indent:-10px;

     

     

    BORDER-BOTTOM: #D6E8FF 0px solid;

     

     

    FONT-FAMILY:tahoma, Segoe UI, Arial, sans-serif;

     

     

     

     

    HEIGHT

     

    : 18px;

     

     

    BACKGROUND-COLOR: #D6E8FF;

     

     

    }

     

     

     

     

    DIV.RadPanelBar_Office2007

     

    .rpRootGroup .rpItem {

     

     

    BACKGROUND-COLOR: #D6E8FF;

     

     

    PADDING-BOTTOM: 7px;

     

    }

     

     

     

    DIV.RadPanelBar_Office2007

     

    .rpRootGroup .rpItem .rpGroup .rpItem {

     

     

     

    PADDING-BOTTOM: 0px;

     

    }

     

     

     

    DIV.RadPanelBar_Office2007 .rpRootGroup .rpLink:hover {

     

     

    BORDER-TOP: #6693CF 1px solid;

     

     

     

     

    BACKGROUND-POSITION

     

    : 0px 0px;

     

     

    BACKGROUND-IMAGE: url('PanelBar/item-bg.gif');

     

    }

     

     

     

    DIV.RadPanelBar_Office2007 .rpRootGroup .rpExpandable {

     

     

    BORDER-BOTTOM-COLOR: #D6E8FF;

     

     

    BORDER-BOTTOM: #D6E8FF 1px solid;

     

    }

     

    DIV.RadPanelBar_Office2007 .rpRootGroup .rpExpanded {

     

     

    BACKGROUND-POSITION: 0px 0px;

     

     

    BORDER-BOTTOM: #D6E8FF 1px solid;

     

    }

     

     

    DIV.RadPanelBar_Office2007 .rpRootGroup .rpLink .rpText {

     

     

    BORDER-TOP: #FFFFFF 1px solid;

     

    }

     

     

    DIV.RadPanelBar_Office2007 .rpItem .rpGroup .rpLink {

     

     

    BORDER-RIGHT: #D6E8FF 1px solid;

     

     

    PADDING-RIGHT: 0px;

     

     

    BORDER-TOP: #D6E8FF 1px solid;

     

     

    PADDING-LEFT: 0px;

     

     

    FONT-WEIGHT: normal;

     

     

    BACKGROUND-IMAGE: none;

     

     

    PADDING-BOTTOM: 0px;

     

     

    MARGIN-LEFT: 0px;

     

     

    BORDER-LEFT: #D6E8FF 1px solid;

     

     

    COLOR: #000000;

     

     

    width:175px;

     

     

    MARGIN-RIGHT: 10px;

     

     

    MARGIN-left: 10px;

     

     

    PADDING-TOP: 0px;

     

     

    BORDER-BOTTOM: #D6E8FF 1px solid;

     

     

    BACKGROUND-COLOR: #D6E8FF;

     

    }

     

    DIV.RadPanelBar_Office2007 .rpItem .rpGroup .rpLink:hover {

     

     

    BACKGROUND-POSITION: 0px 0px;

     

     

    BORDER-TOP: #FFBD69 1px solid;

     

     

    PADDING-LEFT: 0px;

     

     

    BORDER-LEFT-COLOR: #FFBD69;

     

     

    BACKGROUND-IMAGE: url('PanelBar/ItemHoverBg.gif');

     

     

    MARGIN-LEFT: 0px;

     

     

    MARGIN-RIGHT: 10px;

     

     

    MARGIN-left: 10px;

     

     

    BORDER-BOTTOM: #FFBD69 1px solid;

     

     

    BORDER-RIGHT-COLOR: #FFBD69;

     

    }

     

    DIV.RadPanelBar_Office2007 .rpItem .rpGroup .rpSelected {

     

     

    BORDER-TOP: #FFBD69 1px solid;

     

     

    BORDER-LEFT-COLOR: #FFBD69;

     

     

    BACKGROUND-IMAGE: none;

     

     

    BORDER-BOTTOM: #FFBD69 1px solid;

     

     

    BACKGROUND-COLOR: #FFE6A0;

     

     

    BORDER-RIGHT-COLOR: #FFBD69;

     

     

    MARGIN-RIGHT: 10px;

     

     

    MARGIN-left: 10px;

     

    }

     

    DIV.RadPanelBar_Office2007 .rpItem .rpGroup .rpExpanded {

     

     

    BORDER-TOP: #FFBD69 1px solid;

     

     

    BORDER-LEFT-COLOR: #FFBD69;

     

     

    BACKGROUND-IMAGE: none;

     

     

    BORDER-BOTTOM: #FFBD69 1px solid;

     

     

    BACKGROUND-COLOR: #FFE6A0;

     

     

    BORDER-RIGHT-COLOR: #FFBD69;

     

    }

     

    DIV.RadPanelBar_Office2007 .rpItem .rpGroup .rpDisabled {

     

     

    FONT-SIZE: 11px;

     

     

    COLOR: #000000;

     

    }

     

    DIV.RadPanelBar_Office2007 .rpItem .rpGroup .rpDisabled:hover {

     

     

    FONT-SIZE: 11px;

     

     

    COLOR: #000000;

     

    }

     

    DIV.RadPanelBar_Office2007 .rpItem .rpGroup .rpLink .rpOut {

     

     

    BACKGROUND-COLOR: transparent;

     

     

    BORDER-RIGHT-COLOR: #00A1D6;

     

    }

     

    DIV.RadPanelBar_Office2007 .rpItem .rpGroup .rpLink .rpText {

     

     

    BORDER-TOP: 0px solid;

     

     

    BACKGROUND-COLOR: transparent;

     

    }

  2. hamid bahan
    hamid bahan avatar
    9 posts
    Member since:
    Mar 2010

    Posted 19 May 2010 Link to this post

    nobody can help?
    telerik team please!!
  3. UI for ASP.NET Ajax is Ready for VS 2017
  4. Answer
    Kamen Bundev
    Admin
    Kamen Bundev avatar
    1532 posts

    Posted 19 May 2010 Link to this post

    Hello Hamid,

    Add the green colored properties to this rule in your CSS file (somewhere around the middle of the CSS you've sent) and the issue should go away:
    DIV.RadPanelBar_Office2007 .rpRootGroup .rpItem
    {
        BACKGROUND-COLOR: #D6E8FF;
        PADDING-BOTTOM: 7px;
        width: 100%;
        zoom: 1;
    }


    Regards,
    Kamen Bundev
    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.
  5. hamid bahan
    hamid bahan avatar
    9 posts
    Member since:
    Mar 2010

    Posted 19 May 2010 Link to this post

    thanks for reply
    i used attached file to expand/collapse panelbar
    these style is ok in pervious version(2009.Q1)
    but it seems not ok in 2010.Q1
    the image doesnt change  in firefox and ie7

    please check it!
  6. Answer
    Kamen Bundev
    Admin
    Kamen Bundev avatar
    1532 posts

    Posted 25 May 2010 Link to this post

    Hi Hamid,

    I'm sorry for the late reply.

    Which of both expandable images do you want to use - in the screenshot of your RadPanelBar you use different image for the expandable items? To use the one already in your skin folder, add these CSS rules at the end of your skin:
    .RadPanelBar_Office2007_rtl .rpExpandable .rpText,
    .RadPanelBar_Office2007_rtl .rpExpanded .rpText
    {
        padding-left: 20px;
    }
    .RadPanelBar_Office2007_rtl .rpGroup .rpText
    {
        padding: 0 10px;
    }
    .RadPanelBar_Office2007 .rpExpandable .rpText { background-position: 100% 0; }
    .RadPanelBar_Office2007 .rpExpanded .rpText { background-position: 100% -176px; }
    .RadPanelBar_Office2007_rtl .rpExpandable .rpText { background-position: 0 0; }
    .RadPanelBar_Office2007_rtl .rpExpanded .rpText { background-position: 0 -176px; }
    .RadPanelBar_Office2007 .rpGroup .rpLink,
    .RadPanelBar_Office2007 .rpGroup .rpLink .rpOut { background-position: 0 200px; }
    .RadPanelBar_Office2007 .rpGroup .rpLink:hover,
    .RadPanelBar_Office2007 .rpGroup .rpFocused { background-position: 100% -22px; }
    .RadPanelBar_Office2007 .rpGroup .rpLink:hover .rpOut,
    .RadPanelBar_Office2007 .rpGroup .rpFocused .rpOut { background-position: 0 0; }
    /*      <subitems (selected)> */
    .RadPanelBar_Office2007 .rpGroup .rpSelected,
    .RadPanelBar_Office2007 .rpGroup .rpSelected:hover { background-position: 100% -222px; background-color: transparent; }
    .RadPanelBar_Office2007 .rpGroup .rpSelected .rpOut,
    .RadPanelBar_Office2007 .rpGroup .rpSelected:hover .rpOut { background-position: 0 -200px; }
    /*      </subitems (selected)> */
    /*      <subitems (expand arrows)> */
    .RadPanelBar_Office2007 .rpGroup .rpExpandable .rpText,
    .RadPanelBar_Office2007 .rpGroup .rpExpandable:hover .rpText { background-position: 100% -938px; }
    .RadPanelBar_Office2007 .rpGroup .rpExpanded .rpText,
    .RadPanelBar_Office2007 .rpGroup .rpExpanded:hover .rpText { background-position: 100% -1078px; }
    .RadPanelBar_Office2007_rtl .rpGroup .rpExpandable .rpText,
    .RadPanelBar_Office2007_rtl .rpGroup .rpExpandable:hover .rpText { background-position: 0 -938px; }
    .RadPanelBar_Office2007_rtl .rpGroup .rpExpanded .rpText,
    .RadPanelBar_Office2007_rtl .rpGroup .rpExpanded:hover .rpText { background-position: 0 -1078px; }
    /*      </subitems (expand arrows)> */

    Let me know if this helps.

    Regards,
    Kamen Bundev
    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
UI for ASP.NET Ajax is Ready for VS 2017