• shakti singh 23
  • NEWBIE
  • 25 Points
  • Member since 2017

  • Chatter
    Feed
  • 1
    Best Answers
  • 0
    Likes Received
  • 0
    Likes Given
  • 0
    Questions
  • 2
    Replies
Hi Everyone
 I'm trying to get all my labels aligned in the the following VF page. I've tried various things without luck. Any suggestions on how to get the labels left justified? Also I'd like my picklists on the same row as the label as well. Can I use a table format in a VF page? I'm not sure what the best approach here is. Thanks.

User-added image
 
<apex:page standardController="Booking__c" extensions="testing10" docType="html-5.0">
    <apex:form >
    	<apex:pageBlock >
        	<apex:pageBlockSection >
                <apex:pageBlockSectionItem >
                <apex:outputLabel>Booking Date</apex:outputLabel>
                <apex:inputfield value="{!Records.Start_Date_Time__c}">
                <apex:actionSupport action="{!UpdateSitter}" event="onchange" reRender="D1"/>   
           		</apex:inputfield>
			    </apex:pageBlockSectionItem>                 
            </apex:pageBlockSection>
            
            <apex:pageBlockSection columns="1" id="D1">
               
                 <apex:outputLabel rendered="{!FlagH}">Baby Sitters</apex:outputLabel>
                 <apex:selectList value="{!SelectedSitter}" size="1" rendered="{!FlagH}"> <!--var holding selected item-->
                 <apex:selectOptions value="{!RecordOption}" rendered="{!FlagH}"/> 
                    </apex:selectList>
              
                  <apex:outputLabel rendered="{!FlagH}">Clients</apex:outputLabel>
                  <apex:selectList value="{!SelectedClient}" size="1" rendered="{!FlagH}"> <!--var holding selected item-->
                  <apex:selectOptions value="{!ClientOption}" rendered="{!FlagH}"/> 
                  </apex:selectList>
                 
                <apex:outputLabel rendered="{!FlagH}" >Hours Needed</apex:outputLabel>
                <apex:input type="number" value="{!BookHours}" html-min="2" html-max="10" style="width:40px;" rendered="{!FlagH}"/>
                
              </apex:pageBlockSection>
              <apex:pageBlockButtons location="bottom">
	          <apex:commandButton action="{!save}" value="Save"/>
	          </apex:pageBlockButtons>
            

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