Printable Version of Topic

Posted by: noiseradiostar Feb 16 2007, 04:02 PM

Hi, I have tried all day to get a mailing list form to display on one line of a table row, but no matter what I try the form keeps displaying on two lines.

Here's the way the page should display (without the mailing list FORM)
http://www.13stars.net/test1.html

What I'm trying to accomplish is to put a mailing list form in the bottom black TR that spans across the table (above the gray border)

Here's what happens when I try to put it all in one TD
http://www.13stars.net/test3.html

I don't understand why it's not displaying it in one row, and why it uses a second line and pushes the table down.

I've also tried putting each element in a seperate TD, with this result:
http://www.13stars.net/test4.html

As you can see it syncs the TD's to the TD's above it. How do I start a new TR so that I can have new TD widths? I tried starting a new table at the bottom, but that just screws up my whole page.

I've also tried a new DIV across the bottom instead of a TR. That had the same results. I've tried everything imaginable...changing widths, colspan's, everything. I found this forum hoping that someone may be able to help me.

Any help?

Posted by: pandy Feb 16 2007, 04:24 PM

You have this:

FORM is a block level element, so it "breaks the line". Move the text inside the form.
http://htmlhelp.com/reference/html40/block.html

You may also want to pay a visit to the validator.
http://htmlhelp.com/tools/validator/

Posted by: noiseradiostar Feb 16 2007, 05:26 PM

Awesome! Thanks a lot! Yeah, i was looking for the html validator. I know my code probably needs lots of cleanup.

One more quick question. Why won't the table row's height (the TR holding the form) adjust? The Valign doesn't seem to work either. Anything I can do to tighten up the width around the form? Am I missing something easy?

Thanks again!

Posted by: pandy Feb 16 2007, 05:51 PM

Browsers may add margins to FORM as well as to other block lever elements (that's what makes paragraphs look like paragraphs). Add this to the form tag.

There are better ways to use CSS than the style attribute. You can read more about that if you click the CSS Reference link in the menu at the top of this page.

Posted by: noiseradiostar Feb 20 2007, 02:51 PM

Thanks again for your help! Now, I'm on to Phase 2 which is putting links in the same table row. Once again, the form is splitting up between lines and also pusshing the table over to the right.
You can see it here:
http://www.13stars.net/test3.html

Once again I've tried every imagainable combination as well as looked at the tutorials and info in the CSS Reference. Nothing seems to work. Any help?

I appreciate your help!

Posted by: Darin McGrew Feb 20 2007, 03:38 PM

If you turn on borders for your tables, then it will be easier to see what is going on.

You also have http://www.htmlhelp.com/cgi-bin/validate.cgi?url=http%3A%2F%2Fwww.13stars.net%2Ftest3.html&warnings=yes (some of which indicate structural problems) and http://jigsaw.w3.org/css-validator/validator?uri=http%3A%2F%2Fwww.13stars.net%2Ftest3.html&warning=1&profile=css21&usermedium=all (not all of which are related to your non-standard scrollbar properties).

Posted by: noiseradiostar Feb 22 2007, 10:49 AM

OK, I've turned on all borders and fixed most of the html errors (except the ALT tags). I'm still not getting it. Why is the form and the link at the bottom not aligning on one row?

http://www.13stars.net/test3.html

I appreciate everyone's help. This is the last problem and then I'll be totally done with the site (well...the design at least)

Posted by: pandy Feb 22 2007, 11:13 AM

Now you have the text inside the form, but you close the form directly after the text instead of letting it contain the form contols too, which is really the purpose of the FORM element.

Posted by: noiseradiostar Feb 22 2007, 12:05 PM

Yes, I changed that around when I was trying to think of anything and everything it could be. I changed it back as you can see and it still has the problem.

It seems to me the problem is that the columns at the bottom are wanting to align with the columns in the middle of the page. In fact, in the TD cell that holds the FORM, I can change the TD width from 100 to 1200 and it doesn't matter. It still aligns with the column containing the "thirteenstars" graphic above it. Any idea why its doing this and not acting independently regarding the width?


(I know you're murmuring "rookie" to yourself right now. Haha. I promise I'll stop bugging everyone if I can just fix this one problem.)

Posted by: Darin McGrew Feb 22 2007, 01:33 PM

It's hard to be sure with all the nested tables, but it looks like the cells that are being aligned with each other are part of the same table. So of course they align with each other: that's what tables do.

Posted by: pandy Feb 22 2007, 11:30 PM

The text and the form inputs have to wrap. There isn't toom for them not too. In your mind, put the text before the input. Does it look like there's room enough for that? Nope. If you remove all the   there's almost room for them on one line. Even if you make the text and the input smaller, wrapping will still occur if the user uses a larger text size than you planned for. Simply put, if it's essential to have it all on one line, don't make it so darn tight.