Browser issues with HTML caption tag inside table tag

Question

Html Caption tag issues inside table tag. The issue is with alignment.

<html:form action="myAction">

<table border=0 id="main_table" width="100%">
       <tr>
          <td>
             <table id="t1" width="100%">
                <caption align= "left" id="t1_c">
                  <b><bean:message key="schedule.automatic"/></b>
                </caption>
             <tr>
                <td>
                   <label>
                       <input type=radio name="gather_group" value='NEVER'        onclick="selectRadio(this.value)">
                          <bean:message key="myconsole.schedule.never"/>
                   </label>
               </td>
             </tr>
            </table>
          </td>
            <table id="t2" width="100%">
               <caption align="left" id="t2_c">
                 <b><bean:message key="schedule.whenToGather"/></b>
               </caption>
               <tr id="t2_r1">
                 <td><bean:message key="schedule.hourOfDay"/></td>
               </tr>
            </table>
      </tr>

I think the caption tag is having issues while running in different browsers. The text displayed using bean:message property is displayed perfectly in IE8 and above, but in firefox version-28.0, chrome, safari.. the text position gets displaced.

Any help is appreciated.

Note: I am not using HTML5

Answer 1

I have got the fix itself, use inline style attribute like this ..

<caption align= "left" id="t1_c" style="caption-side: top; width: auto; text-align: left;">

Thanks to all.