CODEWITHSUNDEEP
c#asp.nethtml
SpaceApple
SpaceApple

Reputation: 1327

colspan not expanding the columns length

I am using C# ASP.NET that uses html tables. The problem comes in to this specific panel that I am working with where my column inside the table is not expanding for what ever reason even though my other panels the colspan property works correctly except for this one.

Here are some screenshots to explain what is happening.

enter image description here

enter image description here

Not even though I am setting the colspan to what ever value the column does not expand. Also I know there is two tables within this panel and there is a reason to why I have two, so it's not a mistake. Basically I want the left button to stay left of the panel and secondly I want the right button ("Next") to be as far right of the page as possible.

Any ideas why this is happening or is there a better solution to this problem?

By the way I am using Google Chrome to test if this adds any value to the question.

Upvotes: 0

Views: 1297

Answers (4)

mlorbetske
mlorbetske

Reputation: 5649

colspan only changes how many columns in a table a cell takes up, not how wide it actually is. Use style="width:..." (or set it in CSS) to set the width. What's happening right now is your table is being divided into one hundred and one imaginary parts (the left side having one hundred parts, the right having one).

An example of using colspan correctly:

<table>
    <tr>
        <td colspan="2">
            Hello world
        </td>
    </tr>
    <tr>
        <td>
            Left
        </td>
        <td>
            Top
        </td>
    </tr>
</table>

Upvotes: 0

Umesh
Umesh

Reputation: 2732

Not sure why you are using ColSpan when you have only 1 row in second table. To achieve what you are expecting, do the following:

set Width="100%" in second table

in first "td" for back button, include "align=left"

in second "td" for next button, include "align="right"

Upvotes: 3

Tieson T.
Tieson T.

Reputation: 21201

There aren't 100 columns in your page, so that value is relatively worthless. You can (and should) use CSS to achieve your desired width. To have the table itself fill the page, you need to add a style="width:100%;" to it, then your cells will expand to split the difference.

Upvotes: 0

Waqas Raja
Waqas Raja

Reputation: 10870

colspan works with multiple rows; you are expecting it wrongly

<table id="tblButtons" runat="server">
  <tr>
    <td colspan="3">
      column that covers three columns
    </td>
    <td align="right">
      right button
    </td>
  </tr>
  <tr>
    <td>
      column 1
    </td>
    <td>
      column 2
    </td>
    <td>
      column 3
    </td>
    <td>
      column 4
    </td>
  </tr>
</table>

column 1, 2, 3 will be covered by the td having colspan="3"

Upvotes: 1

Related Questions