Tek-Tips is the largest IT community on the Internet today!

Members share and learn making Tek-Tips Forums the best source of peer-reviewed technical information on the Internet!

Register Log in
  • Congratulations Chris Miller on being selected by the Tek-Tips community for having the most helpful posts in the forums last week. Way to Go!

Text Area Question 1

Status
Not open for further replies.
fmrock

fmrock

Programmer
Sep 5, 2006
510
US
I have a project I am working on. I have the page set to 100% height and width. I have a text area box on the right side that (if possible) I would like the height to grow/shirnk to the size of the table cell that it is in.

Is this possible? I found a few things online but none have worked.

Code: 
<textarea style="height:100%" name="Test"></textarea>
 
Sort by date Sort by votes
I even tried in a blank page with nothing but the text area, with no luck.

Then I triend putting it in a table with a 100% height

Code: 
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "[URL unfurl="true"]http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">[/URL]
<html xmlns="[URL unfurl="true"]http://www.w3.org/1999/xhtml">[/URL]
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
</head>

<body>
<table height="100%" width="500" border="0" cellspacing="0" cellpadding="0">
  <tr>
    <td height="100%"><textarea style="height:100%" name="Test"></textarea></td>
  </tr>
</table>


</body>
</html>
 
Upvote 0 Downvote
Unless the parent table cell has height specified, percentage height (such as 100%) will be ignored and replaced by height: auto; which means the height of the content inside. Either give the parent container a specific height or textarea a pixel height.

___________________________________________________________
[small]Do something about world cancer today: PACT[/small]
 
Upvote 0 Downvote
Hi

Your code works as it should. The [tt]textarea[/tt] fills the entire [tt]table[/tt] cell.

Please note that the [tt]table[/tt] tag has no height attribute. So if you want to have the [tt]table[/tt] as high as the available vertical space, then remove the [tt]doctype[/tt]. That way the browsers will know that the page is a mess and will not try to render it as valid HTML document.

Feherke.
 
Upvote 0 Downvote
feherke,

The table tag has a height of 100% The goal of this project is to have the end user not have to scroll at all on this page.

Also, Not sure but why is the HTML a mess on this page?

What would be a better way of doing this?
 
Upvote 0 Downvote
Hi

fmrock said:
The table tag has a height of 100%
Click to expand...
Certainly your [tt]table[/tt] tag has it. But the W3C specification for the [tt][/tt] tag has no height attribute.
fmrock said:
Also, Not sure but why is the HTML a mess on this page?
Click to expand...
Because it is invalid. When it has 3 markup errors the "mess" word sounds quite appropriate. Try to convince any other document viewer software to forgive 3 structural errors. They will refuse. I say the browsers should do the same.
fmrock said:
What would be a better way of doing this?
Click to expand...
CSS design. Use the [tt]table[/tt]s for tabular data representation only.

Feherke.
 
Upvote 0 Downvote
Feherke,

I have validated my whole page with Dreamweaver CS3 and fixed all of the errors. Removing the height references.

Do you have any examples of CSS design?

The page I am building is somewhat complicated, because its a page to view medical charts (tiff) images. So on the left side of the page, the tiff viewer (Browswer Plugin) shows the chart. on the right side, there is information about the chart, and a form where the user can update certian information. This is where the textarea box is.

Like i mentioned earlier, the goal is to not have the user have to scroll up or down in the browswer.
 
Upvote 0 Downvote
Upvote 0 Downvote
Feherke,

Thanks for your help. I have already applied alot of CSS i have found.

Can you do 100% height and with with a CSS design.

I need the right side to be 300px and the left to fill the rest? Have you seen any examples like this?
 
Upvote 0 Downvote
Status
Not open for further replies.

Similar threads

scorney
  • Locked
  • Question
background image with overlay which Hover when over a specific Area/Form
Replies
1
Views
703
3esolar
3
waubain
  • Locked
  • Question
Prevent user from getting a 404 error if click on a hover text displaying a hidden image. 1
Replies
5
Views
223
jjgupta915
jjgupta915
jason.lex
  • Locked
  • Question
Bootstrap grid and columns question
Replies
0
Views
128
jason.lex
jason.lex
coldbohemia
  • Locked
  • Question
I'm inserting a text file into a we
Replies
2
Views
167
coldbohemia
coldbohemia
pendle666
  • Locked
  • Question
Inserting same line of text of every web page - &quot;link&quot; insert? 1
Replies
6
Views
219
ChrisHirst
ChrisHirst

Part and Inventory Search

Sponsor

Back
Top