How to set the position of Validation Callout Extender

In this post i am going to explain how to set Popup Position for Validator Callout Extender .
we need to create CSS class for setting popup potion  like blew for Example my class name is  .ValidatorYear in this example.

                                                                            <dx:ASPxComboBox ID="cmbYear" runat="server" Width="180px">
                                                                            </dx:ASPxComboBox>
                                                                            <asp:RequiredFieldValidator ID="reqcmbYear" runat="server" ControlToValidate="cmbYear"
                                                                                Display="None" ErrorMessage="SelectYear" Style="color: #FF3300" ValidationGroup="ValidateAtd"></asp:RequiredFieldValidator>
                                                                            <asp:ValidatorCalloutExtender ID="vccmb" runat="server" Enabled="True" TargetControlID="reqcmbYear"
                                                                                CssClass="ValidatorYear">
                                                                            </asp:ValidatorCalloutExtender>
And after that we have write this CSS ...

<style type="text/css">
        .ValidatorYear {
            left: 240px !important;
            position: absolute !important;
            top: 40px !important;
            visibility: visible !important;
            width: 180px !important;
        }

        .center {
            margin: auto;
        }

        .ValidatorYear div {
            border: solid 1px Black;
            background-color: LemonChiffon;
            position: relative !important;
        }

        .ValidatorYear td {
            border: solid 1px Black;
            background-color: LemonChiffon;
        }

        .ValidatorYear .ajax__validatorcallout_popup_table {
            display: none;
            border: none;
            background-color: transparent;
            padding: 0px;
        }

        .ValidatorYear .ajax__validatorcallout_popup_table_row {
            vertical-align: bottom;
            height: 100%;
            background-color: transparent;
            padding: 0px;
        }

        .ValidatorYear .ajax__validatorcallout_callout_cell {
            width: 20px;
            height: 100%;
            text-align: right;
            vertical-align: top;
            border: none;
            background-color: transparent;
            padding: 0px;
        }

        .ValidatorYear .ajax__validatorcallout_callout_table {
            height: 100%;
            border: none;
            background-color: transparent;
            padding: 0px;
        }

        .ValidatorYear .ajax__validatorcallout_callout_table_row {
            background-color: transparent;
            padding: 0px;
        }

        .ValidatorYear .ajax__validatorcallout_callout_arrow_cell {
            padding: 8px 0px 0px 0px;
            text-align: right;
            vertical-align: top;
            font-size: 1px;
            border: none;
            background-color: transparent;
        }

            .ValidatorYear .ajax__validatorcallout_callout_arrow_cell .ajax__validatorcallout_innerdiv {
                font-size: 1px;
                position: relative;
                left: 1px;
                border-bottom: none;
                border-right: none;
                border-left: none;
                width: 15px;
                background-color: transparent;
                padding: 0px;
            }

                .ValidatorYear .ajax__validatorcallout_callout_arrow_cell .ajax__validatorcallout_innerdiv div {
                    height: 1px;
                    overflow: hidden;
                    border-top: none;
                    border-bottom: none;
                    border-right: none;
                    padding: 0px;
                    margin-left: auto;
                }

        .ValidatorYear .ajax__validatorcallout_error_message_cell {
            font-family: Verdana;
            font-size: 10px;
            padding: 5px;
            border-right: none;
            border-left: none;
            width: 100%;
        }

        .ValidatorYear .ajax__validatorcallout_icon_cell {
            width: 20px;
            padding: 5px;
            border-right: none;
        }

        .ValidatorYear .ajax__validatorcallout_close_button_cell {
            vertical-align: top;
            padding: 0px;
            text-align: right;
            border-left: none;
        }

            .ValidatorYear .ajax__validatorcallout_close_button_cell .ajax__validatorcallout_innerdiv {
                border: none;
                text-align: center;
                width: 10px;
                padding: 2px;
                cursor: pointer;
            }

        div.left {
            height: auto;
            width: 340px;
            vertical-align: top;
        }

        div.right {
            height: auto;
            width: 330px;
            vertical-align: top;
        }

        .container {
            height: auto;
            width: auto;
        }

            .container div {
                display: inline-block;
            }
    </style>