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

Font-size change functionality

5 Answers 56 Views
Grid
This is a migrated thread and some comments may be shown as answers.
License Developer
Top achievements
Rank 1
License Developer asked on 23 Jun 2010, 12:26 PM

See attached screenshot1

We need to have this
functionality in our application. These are simple Anchor tags which call JavaScript function.

 Attached is the JavaScript function(Screenshot2)

  

It is changing the size of text on webpage, but it is not doing so in case of Grid, Panel Bars, Menu.

 

Kindly let us know how it can be done in case of Telerik controls.

 

5 Answers, 1 is accepted

Sort by
0
Dimo
Telerik team
answered on 24 Jun 2010, 02:21 PM
Hello,

RadControls by default use a pixel font size defined in their skins. You are currently setting a font-size for their wrappers, but it cannot override the specified font-size in the RadControls' skins. This is normal.

What you can do is apply CSS classes to the page containers and use CSS styles. For example:

Javascript

document.getElementById('content').className = "fontsize10";

CSS

.fontsize10,
.fontsize10  *
{
        font-size: 10px !important ;
}



All the best,
Dimo
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
0
License Developer
Top achievements
Rank 1
answered on 28 Jun 2010, 11:16 AM
HI,

As per your comment we tried implementing following functionality.

1. We specified following Style in CSS

.fontSize1

{

 

font-size: 12px;

 

}

.fontSize2

{

 

font-size: 15px;

 

}

.fontSize3

{

 

font-size: 20px;

 

}

On .aspx page we have used following functions

 

function

 

fontSize1()

 

{

 

document.getElementById('content').className='fontSize1';

 

 

}

 

 

 

 

function

 

fontSize2()

 

{

document.getElementById('content').className='fontSize2';

 

}

 

function fontSize3()

 

{

document.getElementById(

'content').className='fontSize3';

 

 

}

But when we ran the page, all other text(font size) except radgrid was changing.

Kindly let us know how to change font size in case of radgrid text.

We have specified Font-size opf Radgrid in Control.skin file.

 

0
Dimo
Telerik team
answered on 28 Jun 2010, 02:07 PM
Hello,

Note the usage of "!important" in my demo.

Sincerely yours,
Dimo
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
0
License Developer
Top achievements
Rank 1
answered on 09 Jul 2010, 02:00 PM
HI,

Thanks for your reply. I tried using "!important", but im  unable to resolve this problem. The grid text doesnt change whereas all other text in page changes.

Kindly let me know whats the significance of * in .fontsize10  *, and the importance of "!important"

Kindly help us to resolve this problem.


0
Accepted
Dimo
Telerik team
answered on 09 Jul 2010, 02:15 PM
Hello,

.className * { }  means "apply styles to all descendants of the element with a className CSS class"

!important means "apply the style property even if it conflicts with other style properties with higher specificity "

If you need to work with CSS, I recommend you to get familiar with the language basics:

http://css.maxdesign.com.au/selectutorial/

Best wishes,
Dimo
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
Tags
Grid
Asked by
License Developer
Top achievements
Rank 1
Answers by
Dimo
Telerik team
License Developer
Top achievements
Rank 1
Share this question
or