using my owner css on Ext.net Controls

[Egale]

Dear all,

I have page contain combo Boxes with icon for each combo Boxes, I want to use unique Css for each combo box to put specific wide between
every combo box and it's icon, but the problem that the control inherent from the specific Css ".x-form-field-wrap .x-textfield-icon "
so please if u could to give me help by explain how can i use my style on every control alone without do that on all the same controls in the same page

and thank in advance

this is the code

<asp:Content ID="Content1" ContentPlaceHolderID="cpMain" Runat="Server">
<style type="text/css">
.refreshIcone{
top: 3px;
left: -31px;
}
</style>
 <div style="direction:rtl;float:right;text-align:center;overflow:auto;">
     <script src="PagesJavaScript/TrakingMailsAspx.js" type="text/javascript"></script>
         <script src="../Base/JsBase/BaseJs.js" type="text/javascript"></script>
         <ext:Store IDMode="Static" ID="sMailStatus" runat="server">
        <Reader>
            <ext:JsonReader IDProperty="ID">
                <Fields>
                    <ext:RecordField Name="Name" />
                    <ext:RecordField Name="ID" />
                </Fields>
            </ext:JsonReader>
        </Reader>
    </ext:Store>  
    <ext:Store IDMode="Static" ID="sPriority" runat="server">
        <Reader>
            <ext:JsonReader IDProperty="ID">
                <Fields>
                    <ext:RecordField Name="Name" />
                    <ext:RecordField Name="ID" />
                </Fields>
            </ext:JsonReader>
        </Reader>
    </ext:Store> 
     <ext:FormPanel
                        id="fpMailingTrucking"
                        IDMode="Static"
                        runat="server"
                        AutoHeight="true"
                        Width="900" 
                        Title="البحث عن المعاملات"
                        Border="false"
                        Padding="15">
                        
                        <Items>
						  <ext:ComboBox IDMode="Static" ID="cbMail_Status" StoreID="sMailStatus" runat="server"
                 DisplayField="Name" ValueField="ID" Mode="Local" ForceSelection="true"
                EmptyText="اختر حالة المعاملة " SelectOnFocus="true" AllowBlank="true" AutoShow="true"
                Width="223" Icon="Reload"  Cls="refreshIcone" >
               
            </ext:ComboBox>
             <ext:ComboBox IDMode="Static" ID="cbMailPriorites" StoreID="sPriority" runat="server"
                 DisplayField="Name" ValueField="ID" Mode="Local" ForceSelection="true"
                EmptyText="اختر اولوية المعاملة " SelectOnFocus="true" AllowBlank="true" AutoShow="true"
                Width="223" Cls="refreshIcone" >
               
                  </ext:ComboBox>
				  </ext:Panel>
                                    </ext:Cell>
                                   </Cells>
								      </Items>                
         </ext:FormPanel>

[Egale]

Dear All please If u could answer on this my Q ,I'll be thanks

[Vladimir]

Hi,

Use Cls property to set specific css class

[Egale]

Dear Vladimir

I use it as you can see from my code but nothing happen it still take the default Css, do u have another idea please

[Vladimir]

Hi,

I have no ideas because you did not post your css rules

[Egale]

Dear what do you mean in my Css rules, what do you want from me to send for u

[Vladimir]

You said that try to apply css to specific combo, i don't see how you apply it and which css you try to apply

[Egale]

Dear ,
this is my combobox with the Cls apply on the combobox

.refreshIcone{
top: 3px;
left: -31px;
}

<ext:ComboBox IDMode="Static" ID="cbMail_Status" StoreID="sMailStatus" runat="server"
                 DisplayField="Name" ValueField="ID" Mode="Local" ForceSelection="true"
                EmptyText="اختر حالة المعاملة " SelectOnFocus="true" AllowBlank="true" AutoShow="true"
                Width="223" Icon="Reload"  Cls="refreshIcone" >

But i can't apply that on combobox it still take the default Cls

[Vladimir]

'top' and 'left' css properties are used by browser if 'position' is 'absolute' or 'relative', in other cases those properties will be ignored

[Vladimir]

Why do you want to apply top and left for combo in the FormPanel?