Reputation: 557

How do I get a textarea to span two columns of a table

So I'm learning some php and found my html skills more then a little rusty. I'm trying to get my textarea to span two table columns. W3schools says I can do a colspan for a <th> tag but didn't see if it was supported for <td>. I thought about splitting it between two tables same form. Seems like there would be an easier way to do this. I did try td colspan"2" but it didnt do anything

   echo '<form action="' . $_SERVER['PHP_SELF'] . '" method="post" id="crud_form">';
   echo '<table id="table_articles">';
   echo '<tr><td>Article Title:</td><td> <input type="text" name="art_title" /></td></tr>';
   echo '<tr><td>Author:</td><td> <input type="text" name="author" /></td></tr>';
   echo '<tr><td>Date Posted:</td><td> <input type="text" name="d_posted" /></td></tr>';
   echo '<tr><td>Article Text:</td></tr>';
   echo '<tr><td><textarea rows="10" columns="60" name="art_text" ></textarea></td></tr>';
   echo '<tr><td><input type="submit" name="submit_art" value="Submit" /></td></tr>';
   echo '</table>';
   echo '</form>';

The CSS

   #crud_form
   {
   color:red;
   position:absolute;
   left:300px;
   top:200px;
   border-style:outset;
   border-width:5px;
   border-color:red;
   background-color:#cccccc;
   }

   #table_articles
   {
   color:red;
   width:450px;
   height:300px;
   }

Thoughts? Thanks for the help.

Upvotes: 4

Answers (5)

ABODE

Reputation: 1018

You need to use CSS to make the text area occupy all the width allotted to the td tag, for example:

<tr><td colspan="2"><textarea style="width: 100%;" /></td> </tr>

Upvotes: 2

dotariel

Reputation: 1604

You should be able to use:

<table>
<tr>
    <td colspan="2"><textarea /></td>
</tr>
<tr>
    <td></td>
    <td></td>
</table>

EDIT: I don't think you can do it in CSS.

Upvotes: 1

Nathan Taylor

Reputation: 24606

<td colspan="2">...</td> is absolutely correct.

<table border="1">
    <tr>
        <td>Column 1</td>
        <td>Column 2</td>
    </tr>
    <tr>
        <td colspan="2"><textarea style="width: 100%;" /></td>
    </tr>
</table>

http://jsfiddle.net/uZuhp/

Upvotes: 8