How to modify Popup Caption Style (font, height) from Radgrid in EditMode=Popup

[Marcelo]

Hi,

 I have a radgrid with EditMode​ = "Popup" and EditType = "WebUserControl"

 I can set some parameters of the PopUp using javascript: 

var popUp;

function ShowPopUp(sender, args) {

    popUp = args.get_popUp();

    popUp.style.height = "auto";
    popUp.style.width = "680px";
    popUp.style.left = ((window.innerWidth - 680) / 2).toString() + "px";
    popUp.style.top = ((window.innerHeight - 515) / 2).toString() + "px";

}

But how can I modify the settings from the caption of the popup?

Settings like: 

Height

FontSize

FontColor

BackColor

 

Thank you so much for attention! And sorry for my bad english!

 

 

[Eyup]

Hello Marcelo,

You can achieve this requirement using CSS:

<style>
    div.RadGrid div.rgEditForm div.rgHeader {
        height: 40px !important;
        font-size: large;
        color: white;
        background-color: lightblue;
        background-image: none;
    }
</style>

Hope this helps. Please give it a try and let me know about the result.

Regards,
Eyup
Telerik

[Marcelo]

Hello, Eyup.

Thank's for the answer!

This works fine!! Just the vertical align doesn't works and I don't know why.

After your help my code looks like:

<style type="text/css">

div.RadGrid div.rgEditForm div.rgHeader {

height: 45px !important;

font-size: medium;

color: white;

background-color: rgb(49,147,192);

background-image: none;

vertical-align: middle;   // This doesn't works
}


div.RadGrid div.rgEditForm {

    border-color: rgb(75,75,75);
}
</style>

 

Regards,

Marcelo

 

 

[Eyup]

Hello Marcelo,

You can achieve that by adding the following line to the mentioned rule:

line-height: 33px;

That should do the trick. Looking forward to your reply.

In addition you can check various resources over the net about centering div content vertically:
http://www.vanseodesign.com/css/vertical-centering/

Regards,
Eyup
Telerik

[Marcelo]

Hello Eyup.

I did it with the command above:

 

padding-top: 10px;

 

Thank's again!!!

You can close this thread.

[Hhj]

How to modify Popup Caption alignment in code behind

[Eyup]

Hi,

You can use the CSS rule below to achieve this requirement:

<EditFormSettings CaptionFormatString="Modify a Record">
</EditFormSettings>

CSS:

div.RadGrid .rgEditForm .rgHeader > div:first-child {
    margin-left: 60%;
}

I hope this will prove helpful.

Regards,
Eyup
Telerik by Progress