dansasu11
dansasu11

Reputation: 913

Colspan are the same but does not look the same in browser

The colspan is the same but does not look the same when I run the program and view it in the browser, Why is that? One is a little bit longer than the other. Parent/Guardian Information is longer than the Student Information..Thanks for your Help

 <td class="tblHead"  colspan="6">Student Information</td>

<td class="tblHead" colspan="6"> Parent/Guardian Information</td>



   <asp:Panel ID="panelADD" runat="server">
    <table style="width:100%; text-align:left;">
    <tr>
        <td class="tblHead"  colspan="6">Student Information<uc2:PopupCertify ID="ucPopupCertify"        runat="server" />
        </td>
    </tr>
    <tr>
    <td> &nbsp;</td>
    </tr>



 <table style="width:100%; text-align:left;">
      <tr>
       <td class="tblHead" colspan="6"> Parent/Guardian Information</td>
    </tr>
    <tr>

Upvotes: 0

Views: 429

Answers (1)

Doc Kaos
Doc Kaos

Reputation: 154

Colspan doesn't set the width. It simply says this cell spans X number of columns. So in your case you are creating a single cell that spans 6 columns. Since the width of the columns spanned could be different, then the width of the cells will be different.

Since currently there is only one row, with a single cell in that row (that spans 6 columns), the cell width will be the same size as its contents. So, because the text "Parent/Guardian Information" is longer than "Student Information" its cell will be longer to accommodate it.

To make these cells the same size, you should update your CSS Class tblHead to include a width:

<style>
.tblHead {
  width: 350px;
  /* Your other style information */
}
</style>

Upvotes: 1

Related Questions