+ Start a Discussion
Karthick RajaKarthick Raja 

How to Add the style for Dependent Picklist

Hi folks,
      Can anyone tell me how to add the style for dependent picklsit?
I have added the custom style in visualforce page for dependent pick list
<apex:page standardController="Contact" standardStylesheets="false" showHeader="false">
    <head>
        <style> 
            .picklist {
                height:33px;
                width:255px;
                font-size:14px;
                font-style:italic;
                font-weight:bold;
                text-align:left;
                padding-top:7px;
                padding-bottom:7px;
                padding-left:10px;
                border: 0;
            }
        </style>
    </head>
    <body>
        <apex:form >
            <!-- Parent picklist -->
            <apex:inputField id="parent" value="{!Contact.Country__c}" styleClass="picklist" style="left:400px; top:250px;"/>
            <div  class="picklist">
                <apex:inputField id="children" value="{!Contact.State__c}"/>
            </div>
        </apex:form>
    </body>
</apex:page>

But It gives
User-added image
I want to display state field as same as Controlling picklist


Thanks in advnce
Karthick

 
developer sfdc 15developer sfdc 15
Hi Please add border in the class and remove the class from dependent picklist.

<apex:page standardController="Contact" standardStylesheets="false" showHeader="false">

    <head>

        <style>

            .picklist {

                height:33px;

                width:255px;

                font-size:14px;
                font-style:italic;

                font-weight:bold;

                text-align:left;

                padding-top:7px;

                padding-bottom:7px;

                padding-left:10px;

                border: 1px solid #CCC;

            }

        </style>

    </head>
    <body>
        <apex:form >
            <!-- Parent picklist -->
            <apex:inputField id="parent" value="{!Contact.Country__c}" styleClass="picklist" style="left:400px; top:250px;"/>
            <div  >
                <apex:inputField id="children" value="{!Contact.State__c}"/>
            </div>
        </apex:form>
    </body>
</apex:page>
Karthick RajaKarthick Raja
@developer sfdc 15
The dependent picklist doesnt give the style same as Controlling picklist