Preserved Topic: i hate form tags! (Page 1 of 1)

i have got a navigation bar for a site that is on the top of a page and fills the whole width.
the items are all images that are next to each other in that cell. only the last item should be a single input-text for keyword-searching followed by a "search" image.

but if i am using the form tag it makes two line breaks in my beautiful navigation bar. one before the form and one after it. can i work around this somehow? putting the whole bar into the form?

thanks!

GRUMBLE: I'm sure I've had this problem. Try getting rid of any whitespace, wrapping it in a DIV and/or using display: inline.

If they don't work I'll have a dig around and see if I can find the code. Anychance of a link or the code to view?

___________________
Emps

FAQs: Emperor

personally, I don't think it should do that, but why not put the <FORM></FORM> tags before and after the table?

are you sure that your not just including the newlines from the way you formatted your source?


Code - CGI - links - DHTML - Javascript - Perl - programming - Magic - http://www.twistedport.com
ICQ: 67751342

Forms are block level elements. Try giving the form a CSS class and setting that class to display:inline.

ok, im sure there isnt a single whitespace anywhere.

and yes, im a bit more successful if i do the form around it, but then i have problems with image aligns... but i think i get that fixed.

thanks.

BUT: meanwhile i experienced a even bigger problem!
when i resize the browser-window in mozilla, then the images make a break when the window gets smaller. normally they are supposed to stay where they are and just are out of the window!

Try white-space:nowrap;

quote:

---

BUT: meanwhile i experienced a even bigger problem!
when i resize the browser-window in mozilla, then the images make a break when the window gets smaller. normally they are supposed to stay where they are and just are out of the window!

---

I've had the problem before. I am not sure how you are doing the nav bar, but are you using a background image to fill in the white space? If so, is it 1px wide?
If it isn't 1px wide, might want to change that. If so, then the images and form for searching may be the problem.

Hard to tell really without an example.

Later,
C:\


~Binary is best~

where exactly do i set this
white-space:nowrap;
or
display:inline;

in the table? in the cell?

Like petskull said, putting the <form> tags before and after whatever element the actual form is in will usually eliminate the problem.

I had the same problem, and Petskull's and DL's Tip worked for me!

*runs naked before Grumble works it out*

yes yes, the form problem is already gone, but what about the other one?

also, how can i place two tables next to each other. they also make a line break once i start a new table.

About the two tables beside each other:

Make an outline table that will hold the two tables with content. Let each additional table flow off of the TD tags.

<!--outline table-->
<table>
<tr>
<td>

<!--INSERT THE FIRST TABLE HERE-->
<table>
<tr>
<td>
<p>content</p>
</td>
</tr>
</table>

<!--Close the first TD tag-->
</td>
</tr>

<!--Start the second table-->
<tr>
<td>

<!--Start the table contents-->
<table>
<tr>
<td>
<p>Second table contents</p>
</td>
</tr>
</table>

<!--Close the outline table-->

</td>
</tr>
</table>

Later,
C:\


~Binary is best~

the white-space:nowrap should go in the style sheet for the class or id of the element that you didn't want any wrapping in (probably the <div> or whatever it is that holds the images all in a line). the display:inline should go in the style sheet for the class or id of the form.

Putting two block level elements next to each other is difficult without resorting to tables for two reasons: one, CSS only provides one way of doing it that I know of, and it's not that flexible. Two, many browser bugs make the flexibility even worse. But the idea is to set both block level elements (the tables) to float:left; ... in practice though, this can sometimes take days of tweaking related markup and CSS to get right.

Elegant solution, Slime- Informative and well thought out in it's message.

I'd still using the double-celled table...


Code - CGI - links - DHTML - Javascript - Perl - programming - Magic - http://www.twistedport.com
ICQ: 67751342

ok, all problems solved except for the mozilla one.

the element holding all images in one line is a TD so i put the white-space:nowrap in the class of that cell, but mozilla still breaks lines.

excuse me, im very sorry.

it DOES work!
i just was too confused in that table-wirr-warr that i put the class=nowrapper in the wrong table cell.

big thanks everyone, especially slime.

*round of applause*


Code - CGI - links - DHTML - Javascript - Perl - programming - Magic - http://www.twistedport.com
ICQ: 67751342