1

Command buttons have aligned to Right ,how to recenter them without using CSS?

 <apex:page standardController="Contact" lightningStylesheets="true" extensions="MContactController" >
        <apex:form id="refID">
            <apex:pageMessages />
            <apex:sectionHeader title="Contact Edit" subtitle="New Contact" />
            
        <apex:pageBlock title="Contact Edit">

            <apex:pageBlockButtons >
                <apex:commandButton  value="Save" action="{!Save}" />
                <apex:CommandButton value="Save & New" action="{!saveAndNew}" /> 
                <apex:commandButton action="{!cancel}" value="Cancel" />
            </apex:pageBlockButtons>
           
            
               

            <apex:pageBlockSection id="ConInfo" title="Member Information" collapsible="false">
                
                <apex:inputField value="{!con.Suffix__c}" />
                <apex:outputField value="{!con.RecordTypeID}" />
                <apex:inputField value="{!con.Salutation}" />
                <apex:inputField value="{!con.AccountId}" required="true"/>
                <apex:inputField value="{!con.FirstName}" />
                <apex:inputField value="{!con.LastName}" required="true" />
                <apex:inputField value="{!con.Middle_Name__c}" />
                <apex:inputField value="{!con.Birthdate}" />
                <apex:inputField value="{!con.Gender__c}" />
                <apex:inputField value="{!con.Spouse_Name__c}" />
                <apex:inputField value="{!con.Role__c}" />
                <apex:inputField value="{!con.Parent_Customer__c}"/>
               
            </apex:pageBlockSection>

</apex:pageBlock>
</apex:form>
</apex:page>

m/p3ofx.png

1 Answer 1

0

As per your latest comments, you need the buttons on the bottom of the VF page too.

Current code

        <apex:pageBlockButtons >
            <apex:commandButton  value="Save" action="{!Save}" />
            <apex:CommandButton value="Save & New" action="{!saveAndNew}" /> 
            <apex:commandButton action="{!cancel}" value="Cancel" />
        </apex:pageBlockButtons>

Should be like this.

        <apex:pageBlockButtons location="top">
           <div style="width:400px; text-align:center;">
            <apex:commandButton value="Save" action="{!Save}" />
            <apex:CommandButton value="Save & New" action="{!saveAndNew}" />
            <apex:commandButton action="{!cancel}" value="Cancel" />
           </div>     
        </apex:pageBlockButtons>
        <apex:pageBlockButtons location="bottom">
           <div style="width:1200px; text-align:center;">
            <apex:commandButton value="Save" action="{!Save}" />
            <apex:CommandButton value="Save & New" action="{!saveAndNew}" /> 
            <apex:commandButton action="{!cancel}" value="Cancel" />
           </div>     
        </apex:pageBlockButtons>
3
  • if we remove the <apex:pageBlockButtons > ,we will loose the buttons at the bottom of the page Mar 24, 2022 at 7:37
  • I have modified my answer as per your comments. Please check now. Mar 24, 2022 at 11:18
  • tried above update code , it is adding extra buttons , if i remove <apex:pageBlockButtons > tag i don't see extra buttons ,i'm trying to align them to center without using CSS Mar 29, 2022 at 11:42

You must log in to answer this question.

Not the answer you're looking for? Browse other questions tagged .