1

So I am using a pageBlockSection with two columns to display some details for particular SObjects. The first column would hold a label and the second column would hold the value for that particular label. Here is a picture to illustrate this: enter image description here

So I am aligning the items in column 1 to the right and the items in column 2 to the left so that they look close to each other but have the same spacing between them. However as you can see there is a large amount of whitespace to the left of the labels (created date, start date, etc) and some of the values have to wrap around due to their length. So I would like to shorten the width of the first column and extend the length of the second. Any ideas on how to implement this?

Improve this question
6

Hi I ran into this challenge and was able to solve it with width percentages. Check out my example below. 

<apex:pageBlockSectionItem dataStyle="width:10%" labelStyle="width:23%" >
<apex:outputLabel >Field 2</apex:outputLabel>
<apex:inputField value="{!obj__c.field2}" style="width:80px"/>
</apex:pageBlockSectionItem>
Improve this answer
4
  • this is kind of clever but does it work at the pageBlockSection level which was the question posed? – cropredy Oct 2 '14 at 1:17
  • While it wasn't the level that the question asked, it still worked perfectly. It actually helped because when I only had pageBlockSection I would have to set render attributes for both the label and the data so there was repeated render attributes. Now I have a rendered for the pageBlockSectionItem which helps readability. Thanks for showing a new way to approach the problem – Louis Pujol Oct 3 '14 at 16:53
  • In fact, you only need to apply the dataStyle and labelStyle to the first pageBlockSectionItem to get all the rows to be x% and y%. The other pageBlockSection elements don't even need to use pageBlockSectionItem as everything ends up rendered in an html table – cropredy Apr 17 '19 at 16:27
  • Brilliant thank you! – patriciajlim Oct 22 '20 at 14:05

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.