You need to sign in to do that
Don't have an account?
Matthew Allen
visualforce tab issue
Hi,
I am working on a VF page with a few tabs across the top. I have got this to work, however when I use a VF page within a tab, the tabs then get in am mess and huge gaps appear between each tab?? any ideas what could effect that? Remove the VF tab and everything gets close together again.
Here is my code
I am working on a VF page with a few tabs across the top. I have got this to work, however when I use a VF page within a tab, the tabs then get in am mess and huge gaps appear between each tab?? any ideas what could effect that? Remove the VF tab and everything gets close together again.
Here is my code
<apex:page standardController="Group_Relationship__c" showHeader="true"> <apex:pageBlock title="Action Plan"> <apex:tabPanel switchType="client"> <apex:tab label="Details" LabelWidth="200"> <apex:form > <div style="float:left; width: 25%;" > <apex:pageBlockSection title="Details" columns="1"> <apex:inputField value="{!Group_Relationship__c.Group_Name__c}" required="false"/> </apex:pageBlockSection> </div> <div style="float:left; width: 25%;" > <apex:pageBlockSection title="" columns="1"> <apex:inputField value="{!Group_Relationship__c.Business_Area__c}" required="false"/> </apex:pageBlockSection> </div> <div style="float:left; width: 25%;" > <apex:pageBlockSection title="" columns="1"> <apex:inputField value="{!Group_Relationship__c.Current_RAG_Status__c}" required="false"/> </apex:pageBlockSection> </div> <div style="float:left; width: 25%;" > <apex:pageBlockSection title="" columns="1"> <apex:inputField value="{!Group_Relationship__c.Comments__c}" required="false"/> </apex:pageBlockSection> </div> <div style="float:left; width: 33.1%; margin-right: 5px;" > <apex:pageBlockSection title="Internal" columns="2"> <apex:inputField value="{!Group_Relationship__c.Executive_Sponsor__c}" required="false"/> <apex:inputField value="{!Group_Relationship__c.Relationship_Owner__c}" required="false"/> </apex:pageBlockSection> </div> <div style="float:left; width: 33.1%; margin-right: 5px;" > <apex:pageBlockSection title="External" columns="2"> <apex:inputField value="{!Group_Relationship__c.Decision_Maker_1__c}" required="false"/> <apex:inputField value="{!Group_Relationship__c.Decision_Maker_2__c}" required="false"/> </apex:pageBlockSection> </div> <div style="float:left; width: 33.2%"> <apex:pageBlockSection title="Finance" columns="2"> <apex:inputField value="{!Group_Relationship__c.Volume_Budget__c}" required="false"/> <apex:inputField value="{!Group_Relationship__c.Volume_Forecast__c}" required="false"/> </apex:pageBlockSection> </div> <div style="float:left; width: 50%"> <apex:pageBlockSection title="Market Share" columns="2"> <apex:inputField value="{!Group_Relationship__c.Fleet_Size__c}" required="false"/> <apex:inputField value="{!Group_Relationship__c.Manheim__c}" required="false"/> <apex:inputField value="{!Group_Relationship__c.BCA__c}" required="false"/> <apex:inputField value="{!Group_Relationship__c.Aston_Barclay__c}" required="false"/> </apex:pageBlockSection> </div> </apex:form> </apex:tab> <apex:tab label="Group Footprint"> <apex:include pageName="Group_Footprint_AP"/> </apex:tab> <apex:tab label="Objectives and Meetings" LabelWidth="200"> <apex:relatedList list="Objectives__r"/> </apex:tab> <apex:tab label="Key Opportunities" LabelWidth="200"> <apex:relatedList list="KeyOpportunities__r"/> </apex:tab> <apex:tab label="Key Threats" LabelWidth="200"> <apex:relatedList list="KeyThreats__r"/> </apex:tab> </apex:tabPanel> </apex:pageBlock> </apex:page>
Refer this link
https://developer.secure.force.com/cookbook/recipe/adding-css-to-visualforce-pages
http://cassacloud.com/nice-visualforce-tabs/