How to display title on top of the pageblockSection

Question

Edit: I'm trying to have apex:pageBlockSection side by side as shown here in the screen shot: I just want to have individual apex:pageBlockTable title rather then one title for all three pageblcoktable

END EDIT

I'm trying to add title on top of the pageblockSection but could not able to do so and I have tried with span and apex:outputlabel none of those attributes work.

Visualforce page:

    <apex:pageBlock title="Employee Salary">           
        <br/>
         <apex:pageBlockSection columns="4" >             
            <apex:pageBlockTable value="{!wrappers}" var="wrapper">                
                    <apex:column headerValue="Ident" >
                        <apex:outputText value="{!wrapper.ident+1}"/>
                    </apex:column>                
                    <apex:column headerValue="From">
                        <apex:input type="text"   value="{!myTime}"/>
                    </apex:column>                 
                    <apex:column headerValue="to">
                        <apex:input type="text"   value="{!myTime}"/>
                    </apex:column>
                    <apex:column headerValue="Action">
                        <apex:commandButton value="Delete" action="{!delWrapper}"> 
                        </apex:commandButton>
                    </apex:column>
            </apex:pageBlockTable>  
<apex:pageBlockTable value="{!wrappers}" var="wrapper">                
                    <apex:column headerValue="Ident" >
                        <apex:outputText value="{!wrapper.ident+1}"/>
                    </apex:column>                
                    <apex:column headerValue="From">
                        <apex:input type="text"   value="{!myTime}"/>
                    </apex:column>                 
                    <apex:column headerValue="to">
                        <apex:input type="text"   value="{!myTime}"/>
                    </apex:column>
                    <apex:column headerValue="Action">
                        <apex:commandButton value="Delete" action="{!delWrapper}"> 
                        </apex:commandButton>
                    </apex:column>
            </apex:pageBlockTable>  

<apex:pageBlockTable value="{!wrappers}" var="wrapper">                
                    <apex:column headerValue="Ident" >
                        <apex:outputText value="{!wrapper.ident+1}"/>
                    </apex:column>                
                    <apex:column headerValue="From">
                        <apex:input type="text"   value="{!myTime}"/>
                    </apex:column>                 
                    <apex:column headerValue="to">
                        <apex:input type="text"   value="{!myTime}"/>
                    </apex:column>
                    <apex:column headerValue="Action">
                        <apex:commandButton value="Delete" action="{!delWrapper}"> 
                        </apex:commandButton>
                    </apex:column>
            </apex:pageBlockTable>  
        </apex:pageBlockSection>
      </apex:pageBlock>

Screen shot:

Answer 1

Just specify a title on your pageBlockSection:

<apex:pageBlockSection title="Subtitle" columns="4">

EDIT

You can also a header facet on each pageBlockTable. Perhaps that is more what you are going for.

<apex:pageBlockSection columns="3">
    <apex:pageBlockTable>
        <apex:facet name="header">Table 1</apex:facet>
    </apex:pageBlockTable>
    <apex:pageBlockTable>
        <apex:facet name="header">Table 2</apex:facet>
    </apex:pageBlockTable>
    <apex:pageBlockTable>
        <apex:facet name="header">Table 3</apex:facet>
    </apex:pageBlockTable>
</apex:pageBlockSection>

With "caption" facets instead:

Answer 2

You can do this easily with a table as below. Make sure table width is 100% and the align attribute of the td element is center.

<apex:page showHeader="true" sidebar="true" standardController="Account">
    <apex:pageBlock title="Contacts">
        <div>
            <table width="100%">
                <tr>
                    <td align="center"><strong>My New Title1</strong></td>
                    <td align="center"><strong>My New Title2</strong></td>
                    <td align="center"><strong>My New Title3</strong></td>
                </tr>
            </table>
        </div>
        <apex:pageBlockSection columns="3"> 
            <apex:pageBlockTable value="{!account.Contacts}" var="contact">
                <apex:column value="{!contact.Name}"/>
                <apex:column value="{!contact.MailingCity}"/>
                <apex:column value="{!contact.Phone}"/>
            </apex:pageBlockTable>
            <apex:pageBlockTable value="{!account.Contacts}" var="contact">
                <apex:column value="{!contact.Name}"/>
                <apex:column value="{!contact.MailingCity}"/>
                <apex:column value="{!contact.Phone}"/>
            </apex:pageBlockTable>
            <apex:pageBlockTable value="{!account.Contacts}" var="contact">
                <apex:column value="{!contact.Name}"/>
                <apex:column value="{!contact.MailingCity}"/>
                <apex:column value="{!contact.Phone}"/>
            </apex:pageBlockTable>           
        </apex:pageBlockSection>
    </apex:pageBlock>
</apex:page>

Screenshot