Take the 2-minute tour ×
Salesforce Stack Exchange is a question and answer site for Salesforce administrators, implementation experts, developers and anybody in-between. It's 100% free, no registration required.

I have 3 <apex:dataTable> in my component. I'd like to put a border around all 3. I'm not getting it however. Any suggestions?

<apex:component access="global" controller="myCont">
    <apex:attribute assignTo="{!custId}" description="The SF ID" id="custId" name="custIDFromEmail" type="String"/>
    <br/>

    <apex:dataTable bgcolor="EEEEEE" border="below" cellspacing="5%" columnsWidth="30%" value="{!innerClassFieldList}" var="c" width="70%">
        <apex:facet name="header">Information</apex:facet>
        <apex:column value="{!c.label}">
            <apex:facet name="header">Field Name</apex:facet>
        </apex:column>
        <apex:column value="{!c.value}">
            <apex:facet name="header">Value</apex:facet>
        </apex:column>
    </apex:dataTable>
    <br/><br/><br/>

    <apex:dataTable border="below" cellspacing="5%" columnsWidth="30%" rendered="{!updateArrayLabelSize}" value="{!updateArrLabels}" var="c" width="70%">
        <apex:facet name="header">Additions / Updates</apex:facet>
        <apex:column value="{!$ObjectType.Customization__c.fields[c].label}">
            <apex:facet name="header">Field Name</apex:facet>
        </apex:column>
        <apex:column value="{!myCust[c]}">
            <apex:facet name="header">Value</apex:facet>
        </apex:column>
    </apex:dataTable>
    <br/><br/><br/>

    <apex:dataTable bgcolor="EEEEEE" border="below" cellspacing="5%" columnsWidth="30%" rendered="{!deleteArrayLabelSize}" value="{!delArrLabels}" var="c" width="70%">
        <apex:facet name="header">Remove</apex:facet>
        <apex:column value="{!$ObjectType.Customization__c.fields[c].label}"/>
    </apex:dataTable>
</apex:component>
share|improve this question
add comment

2 Answers 2

The apex:dataTable border attribute is a number of pixels not a string so replace "below" with a numeric value such as "1".

To gain access to the more flexible CSS styling, use the style and styleClass attributes.

share|improve this answer
add comment

You could enclose all three of your tables inside of one pair of div tags, and apply a border to the div using CSS. You may need to add a clearFix class to your div in order for the border to surround all three, but I'm not 100% sure that will be necessary.

share|improve this answer
    
Clear fix isn't necessary unless you have odd positioning (float). Usually page blocks are not floating. –  sfdcfox Apr 30 at 20:38
    
Makes sense! I wasn't sure what Salesforce's underlying CSS was for data tables so I figured I'd mention it, just in case. –  Kyle Apr 30 at 21:07
add comment

Your Answer

 
discard

By posting your answer, you agree to the privacy policy and terms of service.

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