function readOnly(count){ }
Starting November 20, the site will be set to read-only. On December 4, 2023,
forum discussions will move to the Trailblazer Community.
+ Start a Discussion
ApexPreyApexPrey 

Replicate Apex:Detail CSS styling throughout VF page

So what's the magic sauce to force all components on a VF page to match the CSS of the Apex:Detail block? TabStyle isn't the answer. The rendered Apex:Detail block has a different div class with completely different styles than other Apex page elements. One would think that they should match by default, right? The docs even state the the PageBlock element "uses styling similar to the appearance of a Salesforce detail page, but without any default content."

 

 

Best Answer chosen by Admin (Salesforce Developers) 
ApexPreyApexPrey

That's it! Much appreciated... been plowing through sfdc docs for days and I never saw anything mentioning pageblock mode...

 

I still wonder why some product manager decided that the default styles shouldn't match :-|

 

All Answers

bob_buzzardbob_buzzard

In what way are they different?  Is it that the layout looks like the old theme?  If that is the issue, try setting your pageblock mode attribute to maindetail.

ApexPreyApexPrey

That's it! Much appreciated... been plowing through sfdc docs for days and I never saw anything mentioning pageblock mode...

 

I still wonder why some product manager decided that the default styles shouldn't match :-|

 

This was selected as the best answer