Dreamweaver question: Typing into table cells?

[AC773]

Hello All,

I'm a little new to this web design thing, and I'm using a 50/50 mix of Dreamweaver and Photoshop. For my main text area of the page, I have a nested table. No background image in it, just an HTML white background.

I can type all I like in this box, but when I get to the end of the box and go over, the cells around it stagger and shift out of place, making a visual mess. Photoshop -> ImageReady -> Dreamweaver users will be familiar with this effect, usually caused by typing into a non-nested table cell.

Is there any trick to doing this? What can I do to keep my header elements in place while extending the bottom part of the page to make room for more text?

I would just have made it longer in ImageReady to begin with, but I don't know how much text I'll be using on each page. The idea is I'd like to avoid having a massive white space at the bottom of pages where I use less text.

Any input is appreciated.

 

[NoOrdinary]

I don't 100% understand your question, did you mean you don't want the column width to auto-adjust? If so, you can do it by defining the width (with percentage or pixels) on each column.

Or if you meant about different width on the rows below, you can use 'Merge Cells' function.

 

[AC773]

Thanks for your reply.

The width isn't changing when I type more than what my main nested cell can hold (which is a good thing). I'd like it to just continuously get longer as I type, but instead it just moves the box down and fragments the rest.

It's a little tricky to try to explain without showing you. I have to get to sleep now, but tomorrow I'll host some pictures to demo what's going on.

 

[Matteh117]

By the sounds of it, you want the text in the center of some images and as you type too much, the table cell gets bigger, pushing the sorrounding images away.

If this is correct, then I think you're after an iframe which will have a scrollbar when it gets too big so you only use the specified height and width.

If this IS the case, then paste the below in.

<iframe src="/page-to-put-into-iframe.html" frameborder="0" height="300" width="300"></iframe>

src will grab the page you're trying to display and put it inside.
frameborder is the bevelled frame around the edge. Set to 0 for no frame to show.
height/width are self-explanatory

Then again, if that's not what you're looking for - meh!

 

[ChicoWeb]

That's one of the disadvantages of Imageready and DW. You're almost stuck to a fixed height sometimes because of the code it creates is very static. You really can do much about it unless you wanted to really hack it up and depending on your design that may or may not work.

To answer your question, I would have to see the design.

 

[AC773]

I'm a bit late in posting some screenshots today - I blame Steve.

Anyway, here they are. First is how it's supposed to look:
http://www.pbase.com/ac773/image/85121554/original.jpg

And here's what happens when I type past the width of my text area (the same thing happens whether the orientation is vertical or horizontal):
http://www.pbase.com/ac773/image/85121557/original.jpg

I've tried setting the width of the table cell manually, but it won't let me. After I enter a value and click to start typing, it goes blank again.

Anybody know if things are any better in the ImageReady equivalent built in to Photoshop CS3?

Thanks again to everyone for your continued input.

P.S. - If you're wondering about the page, it's for a small crisis hotline of about 30 employees. I help them with their IT issues every once in a while and the director wanted to know if I could do a website for them. I said "maybe", so this is a little exploratory side-project for now.

 

[rajfantastic]

first off, good design!

second, this is why you should ditch the tables and use CSS.

if you MUST use tables (there really is no reason to), then you will have to set a specific width on your "content" cell. also make sure the "no wrap" checkbox in the properties panel is clear.

 

[Matteh117]

Try clicking inside the table cell and setting a width. This should stop it expanding past that.

 

[ChicoWeb]

Have you tried real text rather then one continuous "a". If you don't have breaks how will it know to return.

 

[AC773]

Try clicking inside the table cell and setting a width. This should stop it expanding past that.

I tried that - for some reason it just went blank after I went to start typing, like it wouldn't accept the value or something.

Anyway, since I had been thinking about upgrading to Photoshop CS3 before, I went ahead and took the plunge now to see if their new (now built-in) ImageReady thing was any better. It sure is - it does CSS now! Makes quite a difference.

So now this brings me another problem. I've fixed the width of my main text area, and it works beautifully. When I type all the way down to the bottom of my text area, however, the white area next to it (below the nav column) doesn't follow it down. When I save it anyway and preview it in a browser, the white space reverts back to its original height, leaving only gray behind the lower portions of my text.

In short, is there any way I can get the page to get longer or shorter depending on how much text I put in? I've seen it done on WYSIWYG template-based editors before and I wonder how simple it would be to do it myself.

Thanks again to everyone for your continued help.