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
Karina ChangKarina Chang 

pageBlockTable without borders or lines in between rows

I have the following pageBlock and I am trying to get rid of the border and lines in between rows.
Is that possible?

<apex:pageBlock mode="maindetail"> <p></p> 
         <apex:pageBlockTable value="{!train_courses}" var="tc" align="center" frame="none">
                  <apex:column>              
                           <p></p> <apex:commandLink value="{!tc.Training_Class_Name__c}" action="{!displayId}"> <p></p> 
                                         <apex:param name="AID" assignTo="{!tc.ID}" value="{!tc.ID}" /> 
                           </apex:commandLink>
                  </apex:column>    
          </apex:pageBlockTable>         
</apex:pageBlock> 
Best Answer chosen by Karina Chang
Apoorv Saxena 4Apoorv Saxena 4
Hi Karina,

Just add this CSS to your code :
 
<style>
    table.list tr.dataRow td:first-child {
        border: 0px;
    }
</style>

Please let me know if this helps !

Thanks,
Apoorv

 

All Answers

Apoorv Saxena 4Apoorv Saxena 4
Hi Karina,

Just add this CSS to your code :
 
<style>
    table.list tr.dataRow td:first-child {
        border: 0px;
    }
</style>

Please let me know if this helps !

Thanks,
Apoorv

 
This was selected as the best answer
Karina ChangKarina Chang
Awesome! this gets rid of the lines between the rows.
Would you know how to get rid of the border lines?

User-added image
Apoorv Saxena 4Apoorv Saxena 4
Here you go :
 
<style> 
    .apexp .bPageBlock .detailList .list {
        border: 0px;
    }
    table.list tr.headerRow th:first-child, body .pbBody table.list tr.dataRow td:first-child {
        border: 0px;
    }
</style>


Hope this helps.
Please mark this as solved if this resolves your issue !

Thanks,
Apoorv
Karina ChangKarina Chang
Still... it displays the borders.