Hi,

I am having a bit of an issue on an inline VF page that I am making that I was hoping someone might have some ideas on how to solve. Basically, I have some fields that are conditionally rendered as either input or output fields. These fields are contained within pageBlockSectionItem tags (so that I could bring in the help text), within pageBlockSection tags, inside column tags, in a pageBlockTable. My issue is that the outputFields seem to always display center justified but the input fields display more like they are left justified which I prefer.

I have tried playing with column widths, adding css either inline or in style tags, etc. but cannot seem to get these to behave the way I would like. It should also be mentioned that I did have showheader="false" sidebar="false" in the page tag previously but that made the help bubbles go away so that is not an option. Any thoughts would be greatly appreciated. Page code and picture examples are below. Let me know if you would like me to post up the controller code as well but I thought it was most likely unnecessary.
 
 



 

<apex:page standardController="Opportunity" extensions="OppCompetitorInsertController" >
 <apex:form >
 
 
  <!--  
   <apex:actionFunction action="{!methodOne}" name="methodOneInJavascript" >
		<apex:param name="firstParam" assignTo="{!testId}" value="" />
   </apex:actionFunction>
	-->
   <style>
	.outputAlign
	{
		text-align:left;
		align:left;
	}
	</style>
 
   <apex:pageBlock title="Add Competitors">
   <apex:pageMessages />
   
					
      <apex:pageBlockTable value="{!wrappers}" var="wrapper" id="wtable" width="95%" columnClasses="outputAlign">
         
         
         <apex:column width="23px" style="background-color: {!wrapper.backgroundColor};" >
         <apex:pageBlockSection >
        
        
        <apex:pageBlockSectionItem helpText="{!$ObjectType.Opportunity_Competitor__c.Fields.Primary__c.inlineHelpText}">
         	<apex:outputLabel value="Primary: " for="primaryFieldId" style="font-weight: bold"/>
         	<apex:inputField value="{!wrapper.oppComp.Primary__c}" id="primaryFieldId" rendered="{!wrapper.editable}"/>
         </apex:pageBlockSectionItem>
         <apex:pageBlockSectionItem helpText="{!$ObjectType.Opportunity_Competitor__c.Fields.Primary__c.inlineHelpText}">
         	<apex:outputField value="{!wrapper.oppComp.Primary__c}" id="primaryFieldId" rendered="{!NOT(wrapper.editable)}" style="padding-right: 100px;" styleClass="outputAlign"/>
         </apex:pageBlockSectionItem>
        
        </apex:pageBlockSection>
         </apex:column>
         
         
         
         <apex:column width="180px" style="background-color: {!wrapper.backgroundColor};">
         <apex:pageBlockSection >
        
        
        <apex:pageBlockSectionItem helpText="{!$ObjectType.Opportunity_Competitor__c.Fields.Competitor__c.inlineHelpText}">
         	<apex:outputLabel value="Competitor: " for="competitorFieldId" style="font-weight: bold"/>
         	<apex:inputField value="{!wrapper.oppComp.Competitor__c}" style="height:20px; width:100px" id="competitorFieldId" rendered="{!wrapper.editable}"/>
         </apex:pageBlockSectionItem>
        <apex:pageBlockSectionItem helpText="{!$ObjectType.Opportunity_Competitor__c.Fields.Competitor__c.inlineHelpText}">
         	<apex:outputField value="{!wrapper.oppComp.Competitor__c}" style="height:20px; width:50px; align:left" id="competitorFieldId" rendered="{!NOT(wrapper.editable)}"/>
         </apex:pageBlockSectionItem>
         
        </apex:pageBlockSection>
         </apex:column>
         
         
        
        
         <apex:column width="43px" style="background-color: {!wrapper.backgroundColor};">
          <apex:pageBlockSection >
        
        
        <apex:pageBlockSectionItem helpText="{!$ObjectType.Opportunity_Competitor__c.Fields.Relationship__c.inlineHelpText}">
         	<apex:outputLabel value="Relationship: " for="relationshipFieldId" style="font-weight: bold"/>
         	<apex:inputField value="{!wrapper.oppComp.Relationship__c}" id="relationshipFieldId" rendered="{!wrapper.editable}"/>
         </apex:pageBlockSectionItem>
         <apex:pageBlockSectionItem helpText="{!$ObjectType.Opportunity_Competitor__c.Fields.Relationship__c.inlineHelpText}" >
         	<apex:outputField value="{!wrapper.oppComp.Relationship__c}" id="relationshipFieldId2" rendered="{!NOT(wrapper.editable)}"/>
         </apex:pageBlockSectionItem>
        
        </apex:pageBlockSection>
         </apex:column>
         
         
         
        
         <apex:column width="105px" style="background-color: {!wrapper.backgroundColor};">
          <apex:pageBlockSection >
        
        
        <apex:pageBlockSectionItem helpText="{!$ObjectType.Opportunity_Competitor__c.Fields.Competitor_Details__c.inlineHelpText}">
         	<apex:outputLabel value="Competitor Details: " for="compDetailsFieldId" style="font-weight: bold"/>
         	<apex:inputField value="{!wrapper.oppComp.Competitor_Details__c}" style="height:20px; width:300px" id="compDetailsFieldId" rendered="{!wrapper.editable}"/>
         </apex:pageBlockSectionItem>
         <apex:pageBlockSectionItem helpText="{!$ObjectType.Opportunity_Competitor__c.Fields.Competitor_Details__c.inlineHelpText}">
         	<apex:outputField value="{!wrapper.oppComp.Competitor_Details__c}" style="height:20px; width:300px" id="compDetailsFieldId2" rendered="{!NOT(wrapper.editable)}"/>
         </apex:pageBlockSectionItem>
        
        </apex:pageBlockSection>
         </apex:column>
         
         
         <apex:column width="14px" style="background-color: {!wrapper.backgroundColor};">
         <apex:pageBlockSection >
         
         
        <apex:pageBlockSectionItem >
         	<apex:commandButton value="Edit" action="{!edit}" immediate="true" rerender="wtable" style="width:50px" >
            	<apex:param name="toDelIdent" value="{!wrapper.ident}" assignTo="{!toEditIdent}"/>
            </apex:commandButton>
        </apex:pageBlockSectionItem>
        
        <apex:pageBlockSectionItem >
         	<apex:commandButton value="Cancel" action="{!cancel}" immediate="true" rerender="wtable" style="width:50px" >
            	<apex:param name="toCancelIdent" value="{!wrapper.ident}" assignTo="{!toCancelIdent}"/>
            </apex:commandButton>
        </apex:pageBlockSectionItem>
        
        </apex:pageBlockSection>
        </apex:column>
        
        <apex:column width="14px" style="background-color: {!wrapper.backgroundColor};">
        <apex:pageBlockSection >
        
        <apex:pageBlockSectionItem >
         	<apex:commandButton value="Delete" action="{!delWrapper}" immediate="true" rerender="wtable" style="width:50px">
            	<apex:param name="toDelIdent" value="{!wrapper.ident}" assignTo="{!toDelIdent}"/>
            	<apex:param name="beingDelTrue" value="true" assignTo="{!wrapper.beingDeleted}"/>
            </apex:commandButton>
        </apex:pageBlockSectionItem>
        
        
        </apex:pageBlockSection>
         </apex:column>
         
         
        
         
      </apex:pageBlockTable>
      <apex:commandButton value="Add Row" action="{!addRows}" rerender="wtable">
         <apex:param name="addCount" value="1" assignTo="{!addCount}"/>
      </apex:commandButton>
      <apex:commandButton value="Save All" action="{!save}" rerender="wtable">
      </apex:commandButton>
   </apex:pageBlock>
 </apex:form>
</apex:page>