I need the Search section and Result section to be in the same line but for some reason the result section is higher than the search section by few pixels.(attached is the screenshot)


.accordionHeader { background: #1797c0; color: white; cursor: pointer; font: 10px Helvetica, Arial, sans-serif; line-height: 25px; padding-left:3px; border-radius:2.5px; margin-bottom:2px; } #accordion .content { background-color: #F4F5F5; display: none; padding:5px; }

<!-- Accordion Search Section -->
<apex:outputPanel id="accordianPanel" layout="block" style="float:left;width:20%;"> <div id="accordion"> <div class="accordionHeader"><h2>Search by License &amp; Product Code (EOC)</h2></div> <div class="content first"> <table style="text-align:right;width:100%;"> <tr> <td><apex:outputLabel for="licEOC" value="License #"/></td> <td><apex:inputText id="licEOC" styleclass="licenseAccordian" value="{!licenseNo}" onChange="validateLicense(this.value,this,'licenseFind');" onKeyUp="validateLicense(this.value,this,'licenseFind');" onmouseout="validateLicense(this.value,this,'licenseFind');"/></td></tr>
------------->
<!-- Results Section -->
<apex:outputPanel id="resultSearchSection" layout="block" style="float:right;width:79%;"> <apex:pageBlock id="licenseDetail" title="{!responseMessage}"> <apex:pageblockButtons location="top" rendered="{!if(licenseWrapper.licenses != null && licenseWrapper.licenses.size >0,true,false)}"> <apex:commandButton rendered="{!userRanking.Register}" value="Register" id="registerLicense" action="{!RegisterLicense}" rerender="dummy"/> <apex:commandButton rendered="{!(userRanking.Transfer || userRanking.Merged || userRanking.Unmerge)}" value="Transfer" id="transferLicense" action="{!TransferLicense}" onclick="redirectTotransfer();" rerender="dummy" /> <apex:commandButton rendered="{!userRanking.SyncLicense}" value="Sync License" id="syncLicense" action="{!null}" rerender="dummy"/> </apex:pageblockButtons>