Visualforce Remove/Hide Line Breaks between PageBlockSections

Question

Is it possible to remove the line breaks specifically between PageBlockSections? My Visualforce page is currently set up to render/display fields, however, this is creating an undesired effect of showing extra line breaks between fields when they are not being rendered. I'm familiar with mode="Edit" functionality at the PageBlock level, but cannot find any docs where this feature can be applied more granularly at the pageblocksection level. Is this possible? Thanks!!

<!-- Start Match Partner Rendering -->
<apex:pageblockSection title="Request Details" collapsible="true" columns="1" 
id="pbs1" >
<apex:pageblockSectionItem >
<apex:outputLabel >Match Partner</apex:outputLabel>
<apex:actionRegion >
<apex:outputField value="{!PartnershipRequest__c.MatchPartner__c}" 
label="Match Partner">
<apex:actionSupport event="onchange" action="{!null}" rerender="op1,op3" />
</apex:outputField>
</apex:actionRegion>
</apex:pageblockSectionItem>
<apex:outputPanel id="op1">
<apex:outputPanel rendered="{!PartnershipRequest__c.MatchPartner__c == 
'Existing Partner'}" id="op2">
<apex:pageblockSection >
<apex:outputField value="{!PartnershipRequest__c.MatchPartnerExisting__c}" />
</apex:pageblockSection>
</apex:outputPanel>
</apex:outputPanel>
<apex:outputPanel id="op3">
<apex:outputPanel rendered="{!PartnershipRequest__c.MatchPartner__c == 'New 
Partner'}" id="op4">
<apex:pageblockSection >
<apex:outputField value="{!PartnershipRequest__c.MatchPartnerNew__c}" />
</apex:pageblockSection>
</apex:outputPanel>
</apex:outputPanel><br />
<!-- End Match Partner Rendering -->

Answer 1

I remember having the same problem due to a workaround I needed. What you're actually trying to do is having one big pageBlockSection with some rows being rendered conditionally, right? To fix this you have to understand how these lines work and when they appear.

Basically, these lines are the bottom separators between the current row and the next row that are set in each cell of the table. These separator lines are displayed for every row (read: pageBlockSectionItem) within a section by default. For the last item in a section, the separator is being oppressed by setting the class of every td in the very last tr to last.

Since you cannot control how the items are being rendered the only thing you can do is fixing the DOM afterwards so the CSS is applied "correctly".

TL;DR: Just write a small JavaScript function that will correctly set up the class for all tds in the last tr of each section. This should do the trick.