+ Start a Discussion
Shwetal DesaiShwetal Desai 

Custom Style not working for "apex:commandButton"

I have created 
Code:
 <style>
    .buttons{background-color : #a8a}
</style> 
<apex:form>
  <apex:commandButton value="Check In" action="{!savedata}" styleClass="buttons"/>
</apex:form>

 
tags in my VF page but still that button has "Gray" color in background.... not that defined color in inline Stylesheet.
What should i do ??
Thanks in advance.


Message Edited by Shwetal Desai on 11-25-2008 05:39 AM
harlequinharlequin

I think it's because of the background image set by the 'btn' class. Try

Code:
.buttons{background-color : #a8a;background-image:none;} 


 

Shwetal DesaiShwetal Desai

yeah it was becoz of background image;

i set it "none" and its working..... now

 

Thanks....... to realize me my silly mistake

SSarangiSSarangi

Hi,

 

I have a similar problem. The css class attributes are not getting applied when i use it with apex:commandbutton. But inline styles seem to work. This is my code. 

<apex:page standardController="Quote">
	<style>
.button {		
	background-image:none; 
	background:white;
	color:#3399FF;
}
</style>
	<apex:pageblock title="Line Item Selection">
		<br />
		<apex:form id="frmNewQuoteLineItem">
			<apex:commandbutton value="Calculate Renewals" styleClass="button">
			</apex:commandbutton>
			<br />
			<br />
			<apex:datatable value="{!Quote.QuoteLineItems}" var="lineItems"
				cellSpacing="5" cellpadding="5">
				<apex:column >
					<apex:facet name="header">Product Family</apex:facet>
					<apex:inputField value="{!lineItems.PriceBookEntry.Product2.Family}"></apex:inputField>
				</apex:column>
				<apex:column >
					<apex:facet name="header">Quantity</apex:facet>
					<apex:inputField value="{!lineItems.Quantity}"></apex:inputField>
				</apex:column>
				<apex:column >
					<apex:facet name="header">List Price</apex:facet>
					<apex:inputField value="{!lineItems.ListPrice}"></apex:inputField>
				</apex:column>
				<apex:column >
					<apex:facet name="header">Discount</apex:facet>
					<apex:inputField value="{!lineItems.Discount}"></apex:inputField>
				</apex:column>
				<apex:column >
					<apex:facet name="header">Sub Total</apex:facet>
					<apex:inputField value="{!lineItems.SubTotal}"></apex:inputField>
				</apex:column>
				<apex:column >
					<apex:facet name="header">Sales Price</apex:facet>
					<apex:inputField value="{!lineItems.UnitPrice}"></apex:inputField>
				</apex:column>
				<apex:column >
					<apex:facet name="header">Total Price</apex:facet>
					<apex:inputField value="{!lineItems.TotalPrice}"></apex:inputField>
				</apex:column>
			</apex:datatable>
		</apex:form>
	</apex:pageblock>
</apex:page>

 

 

Can somebody tell me where I am going wrong?

xueyou38xueyou38

I have the same problem. Did you solve it? Can you share your solution? Thanks.

SSarangiSSarangi
Nope i did not :( am sorry :(
Leslie Martinez 18Leslie Martinez 18
Try using "!important"

<style> 
    .buttons{background-color : #a8a !important;
</style> 
 
<apex:form><apex:commandButton value="Check In" action="{!savedata}" styleClass="buttons"/></apex:form>