This is a migrated thread and some comments may be shown as answers.

Firefox and Safari CSS problem...

7 Answers 76 Views
TreeView
This is a migrated thread and some comments may be shown as answers.
NEX
Top achievements
Rank 1
NEX asked on 05 Aug 2008, 03:20 PM
I am using a modified version of your Default skin stylesheet.  After upgrading to the latest version of your controls for AJAX my stylesheet no longer works in Firefox or Safari.  Still works perfectly in IE 7.  Any ideas?

7 Answers, 1 is accepted

Sort by
0
Atanas Korchev
Telerik team
answered on 05 Aug 2008, 03:33 PM
Hello Alfred Pena,

We need some additional information in order to provide a solution. Could you send us the modified version of your skin? You can either paste it here or open a support ticket.

Regards,
Albert
the Telerik team

Check out Telerik Trainer, the state of the art learning tool for Telerik products.
0
NEX
Top achievements
Rank 1
answered on 06 Aug 2008, 05:41 PM

/*

RadTreeView Default skin

* For notes on the CSS class names, please check RadTreeView common skin file *

*/

/* general styles */

.LargeOrange

{

font: 14px/20px tahoma,verdana,sans-serif;

color: #ff6600;

padding-left: 3px;

padding-bottom: 10px;

text-decoration: none;

margin-bottom: 10px;

}

.Gray

{

color: #d3d3d3;

}

.Mail

{

color: #4682b4;

}

.InfoType

{

color: #66ff66;

}

.InfoGroup

{

color: #ffde71;

}

.Command

{

font: 14px/20px tahoma,verdana,sans-serif;

color: #4682b4;

padding-left: 3px;

padding-bottom: 10px;

text-decoration: none;

margin-bottom: 10px;

}

.SubCommand

{

font: 14px/20px tahoma,verdana,sans-serif;

color: #4682b4;

padding-left: 3px;

padding-bottom: 10px;

text-decoration: none;

margin-bottom: 10px;

}

.RadTreeView_Default

,

.RadTreeView_Default

a.rtIn

{

font: 14px/20px tahoma,verdana,sans-serif;

color: #f8f8ff;

line-height:15px;

}

.RadTreeView_Default

.rtTop,

.RadTreeView_Default

.rtMid,

.RadTreeView_Default

.rtBot

{

padding: 0 0 0 20px;

}

.RadTreeView_Default

.rtPlus,

.RadTreeView_Default

.rtMinus

{

margin:4px 6px 0 -18px;

width:11px;

height:11px;

}

.RadTreeView_Default

.rtPlus

{

background: transparent url(RadControls/TreeView/PlusMinus.gif) no-repeat 0 0;

}

.RadTreeView_Default

.rtMinus

{

background: transparent url(RadControls/TreeView/PlusMinus.gif) no-repeat 0 -11px;

}

.RadTreeView_Default

.rtSp

{

height:17px;

}

.RadTreeView_Default

.rtChk

{

margin: 0 2px;

padding:0;

width:13px;

height:13px;

}

.RadTreeView_Default

.rtIn

{

margin-left:3px;

padding: 2px;

}

/* endof general styles */

 

/* node states */

.RadTreeView_Default

.rtHover .rtIn

{

color: #363636;

background: #e2e2e2;

border: 1px solid #e2e2e2;

padding: 1px;

}

.RadTreeView_Default

.rtSelected .rtIn

{

color:#fff;

background:#454545 url(RadControls/TreeView/ItemSelectedBg.gif) repeat-x 0 0;

border: 1px solid #040404;

padding: 1px;

}

.RadTreeView_Default_disabled

.rtIn,

.RadTreeView_Default

.rtDisabled .rtIn

{

color:#ccc;

}

.RadTreeView_Default

.rtSelected .rtLoadingBelow

{

color: #000;

}

/* endof node states */

 

/* in-line editing */

.RadTreeView_Default

.rtLI .rtEdit .rtIn

{

border:1px solid black;

padding: 1px;

height: 13px;

background: #fff;

}

.RadTreeView_Default

.rtEdit .rtIn input

{

height:13px;

border:0;

line-height:13px;

font:11px tahoma,verdana,sans-serif;

margin:0;

padding:0;

background:transparent;

}

/* endof in-line editing */

 

/* drop targets */

.rtDropAbove_Default

,

.rtDropBelow_Default

{

border: 1px dotted black;

font-size: 3px;

line-height: 3px;

height: 3px;

}

.rtDropAbove_Default

{

border-bottom: 0;

}

.rtDropBelow_Default

{

border-top: 0;

}

/* endof drop targets */

 

/* node lines */

.RadTreeView_Default

.rtLines .rtLI,

.RadTreeView_Default

.rtLines .rtFirst .rtUL

{

background:url(RadControls/TreeView/NodeSpan.gif) repeat-y 0 0;

}

.RadTreeView_Default_rtl

.rtLines .rtLI,

.RadTreeView_Default_rtl

.rtLines .rtFirst .rtUL

{

background:url(RadControls/TreeView/NodeSpan_rtl.gif) repeat-y 100% 0;

}

.RadTreeView_Default

.rtLines .rtFirst

{

background:url(RadControls/TreeView/FirstNodeSpan.gif) no-repeat 0 15px;

}

.RadTreeView_Default_rtl

.rtLines .rtFirst

{

background:url(RadControls/TreeView/FirstNodeSpan_rtl.gif) no-repeat 100% 15px;

}

.RadTreeView_Default

.rtLines .rtFirst .rtUL

{

background:url(RadControls/TreeView/FirstNodeSpan.gif) repeat-y 0 15px;

}

.RadTreeView_Default_rtl

.rtLines .rtFirst .rtUL

{

background:url(RadControls/TreeView/FirstNodeSpan_rtl.gif) repeat-y 100% 15px;

}

.RadTreeView_Default

.rtLines .rtLast,

.RadTreeView_Default

.rtLines .rtLast .rtUL

{

background:none;

}

.RadTreeView_Default

.rtLines .rtTop

{

background:url(RadControls/TreeView/TopLine.gif) 0 0 no-repeat;

}

.RadTreeView_Default_rtl

.rtLines .rtTop

{

background:url(RadControls/TreeView/TopLine_rtl.gif) 100% 0 no-repeat;

}

.RadTreeView_Default

.rtLines .rtLast .rtTop

{

background:url(RadControls/TreeView/SingleLine.gif) 0 0 no-repeat;

}

.RadTreeView_Default_rtl

.rtLines .rtLast .rtTop

{

background:url(RadControls/TreeView/SingleLine_rtl.gif) 100% 0 no-repeat;

}

.RadTreeView_Default

.rtLines .rtMid

{

background:url(RadControls/TreeView/MiddleLine.gif) 0 0 no-repeat;

}

.RadTreeView_Default_rtl

.rtLines .rtMid

{

background:url(RadControls/TreeView/MiddleLine_rtl.gif) 100% 0 no-repeat;

}

.RadTreeView_Default

.rtLines .rtBot

{

background:url(RadControls/TreeView/BottomLine.gif) 0 0 no-repeat;

}

.RadTreeView_Default_rtl

.rtLines .rtBot

{

background:url(RadControls/TreeView/BottomLine_rtl.gif) 100% 0 no-repeat;

}

/* endof node lines */

 

/* rtl-specific styles */

/* firefox */

.RadTreeView_Default_rtl

.rtPlus,

.RadTreeView_Default_rtl

.rtMinus

{

margin-right:-11px;

right:-13px;

}

*

html .RadTreeView_Default_rtl .rtPlus,

*

html .RadTreeView_Default_rtl .rtMinus

{

margin-right:-18px;

right:0;

}

*+html

.RadTreeView_Default_rtl .rtPlus,

*+html

.RadTreeView_Default_rtl .rtMinus

{

margin-right:-18px;

right:0;

}

.RadTreeView_Default_rtl

.rtTop,

.RadTreeView_Default_rtl

.rtMid,

.RadTreeView_Default_rtl

.rtBot

{

padding: 0 20px 2px 0;

margin:0;

}

/* endof rtl-specific styles */

 

/* hacks for Opera & Safari */

@media

screen and (min-width:550px)

{

/* fixes for opera (changes the paddings/margins automatically in rtl mode) */

html:first-child .RadTreeView_Default_rtl .rtPlus,

html:first-child .RadTreeView_Default_rtl .rtMinus,

html:first-child .RadTreeView_Default_rtl .rtFirst .rtLI .rtPlus,

html:first-child .RadTreeView_Default_rtl .rtFirst .rtLI .rtMinus

{

margin:4px 6px 0 -18px;

right:0;

}

/* fix for safari bug (inline-block positioned elements in rtl mode get no width) */

:root .RadTreeView_Default_rtl .rtPlus,

:root .RadTreeView_Default_rtl .rtMinus

{

right: 0;

margin-right: -18px;

margin-left: 7px;

}

}

/* endof hacks */

0
Yana
Telerik team
answered on 08 Aug 2008, 02:25 PM
Hello Alfred,

Thank you for the provided information.

I tested RadTreeView with your styles and wasn't able to see the problem. Please check the attached screenshot. Could you send us a more detailed explanation about the issue? 

Kind regards,
Yana
the Telerik team

Check out Telerik Trainer, the state of the art learning tool for Telerik products.
0
NEX
Top achievements
Rank 1
answered on 08 Aug 2008, 07:05 PM
Sorry, didn't explain myself clearly. The problem is that the color of the text in the nodes is ignored in firefox. I set some nodes having an orange color while others have a white color. This shows up fine in IE. However, in firefox, the text color remains white for all nodes.
0
Yana
Telerik team
answered on 11 Aug 2008, 11:23 AM
Hello Alfred,

Thank you for getting back to me.

I suggest you use '!important' rule in the css styles for different nodes to overwrite the default styles. Please check the attached sample project for a reference.

Regards,
Yana
the Telerik team

Check out Telerik Trainer, the state of the art learning tool for Telerik products.
0
NEX
Top achievements
Rank 1
answered on 23 Aug 2008, 03:56 PM
Ok. Great! That's work...but there is still one another problem.  When I assign an image to a node (ImageURL) the image do not show up in FireFox 2.0  It shows up in IE 7 and Safari 3.1.

So this appears to be a FireFox 2.0 problem...
0
Yana
Telerik team
answered on 26 Aug 2008, 07:14 AM
Hello Alfred,

I tested the ImageUrl property of RadTreeView in Firefox, version 2.0.0.15, and it worked as expected. Please check the attached screenshot.


Best wishes,
Yana
the Telerik team

Check out Telerik Trainer, the state of the art learning tool for Telerik products.
Tags
TreeView
Asked by
NEX
Top achievements
Rank 1
Answers by
Atanas Korchev
Telerik team
NEX
Top achievements
Rank 1
Yana
Telerik team
Share this question
or