Jump to content

[SOLVED] How can I make the width stay and allow the height of the cell to grow.


oceans

Recommended Posts

I have developed codes in php.

I read and display data from MySQL.

I noted that when the length of the data (sentence length) is wider than the table’s cell’s width, the cell gets wider at run time.

How can I make the width stay and allow the height of the cell to grow to accommodate long sentence.

Widening of cell is unsightly.

Thanks.

 

You can try adding this CSS to your display area:

overflow: auto;

(or other variants http://www.w3schools.com/Css/pr_pos_overflow.asp)

 

If that is not what you want, you will have to use javascript/php to trim the line lengths and split the content so that it doesn't go over a set character count.

Thanks,

I tried your suggestion, it does not work.

I have to mention, all my formatting of pages are based on tables and tables in tables.

If I need to do php codes for each cell "I will die" because I have an assorment of cells in many pages.

Is there a auto word wrap or a way to force fix the width and loosen up the height.

 

Thanks,

 

Can we tell the page hey don't widen the cell for any reason.

 

Sorry don't mistake me, writing a script for this may be a bit too much, ok I am lazy; not really, I have many combinations of cell widths and pages.

does this widening get corrected on final render? ie is it just the browser displaying things until its worked out what dimensions to give elements?

 

if not and you want certain elements to have a fixed width, give them a fixed width. the only time when this would possibly fall over is when the content does not permit wrapping. eg an image that is wider than the specified width of textual content with no breaking spaces in it or if you have inadvertently placed white-space: no-wrap on an element that affects this portion of layout.

with css you can set a width to the <td> like:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<style>
table td {
width:50px;
}
</style>
</head>
<body>
<table>
<tr><td>test 1</td><td>test 2 test 2 test 2</td></tr>
</table>
</body>
</html>

 

results in:

             test 2
test 1       test 2
             test 2

I thank both of you, you people are right, I am trying to get away with the no space long sentence, I have no image, so image is not really an issue for me, but thanks for the note.

I tried the following, it works, but strangely enough, if I use any other name other than "div", it does not work, I can't understand. I am trying to create more functions, so that I will have a few cells taken care of respectively.

 

<style type="text/css">
div 
{
background-color:#00FFFF;
width:150px;
height:150px;
overflow: scroll
}
</style>

 

CroNix, i will try your suggestion as well.

Using a div instead of a table cell?

 

<div style="width: 100px; overflow: auto;">
test test test test test testtesttesttesttesttestesttesttesttesttesttestesttesttesttesttesttestesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttest
</div>

 

Look at that (by itself) and you'll see it add scroll bars for overflowing content...  You can even fake some tables using divs if you want.. depends on how you want to display your data.  Got an example online?

Archived

This topic is now archived and is closed to further replies.

×
×
  • Create New...

Important Information

We have placed cookies on your device to help make this website better. You can adjust your cookie settings, otherwise we'll assume you're okay to continue.