Forum Moderators: open

Message Too Old, No Replies

Netscape and forms

Trying to put two forms on the same line

         

lgn

2:54 am on Jun 10, 2003 (gmt 0)



IE always handle having two forms on the same line, with no problem if you use the CSS for {display:inline}

However Netscape 4.x ignores this and puts the second form on a new line. Netscape 6.0 fixes the problem but ignores the centering. And it is broken again in 7.02.

Is their a CSS trick to keep two forms on the same line in netscape, that works across the versions.

pageoneresults

3:00 am on Jun 10, 2003 (gmt 0)

WebmasterWorld Senior Member 10+ Year Member Top Contributors Of The Month



I'm going to guess at this one...

form{
display:inline;
margin:0;
}

And then make sure both <form></form> tags are on the same line with a &nbsp; inbetween...

<form>1st form here</form>&nbsp;<form>2nd form here</form>

lgn

3:12 am on Jun 10, 2003 (gmt 0)



Nope, that didn't work.

pageoneresults

3:17 am on Jun 10, 2003 (gmt 0)

WebmasterWorld Senior Member 10+ Year Member Top Contributors Of The Month



How about wrapping them in <div>s that are set to display inline? Possibly use the float:left and float:right properties? I don't think you'll be able to control the line breaks in NN4.x.

lgn

12:27 pm on Jun 10, 2003 (gmt 0)



I gave up on CSS with Netscape and hardcoded my forms in a 2 column table.

This works in netscape 4.x but 6.x and 7.x ignores my valign attribute and displays the first form with bottom and the second form with top. Creating a half line effect.

Im about ready to say screw the Netscape users. They only represent 3% of my traffic. If these users insist on using an inferior browser product that does not conform to CSS and HTML 4.01 then they deserve the crappy layout, they get.

universalis

12:51 pm on Jun 10, 2003 (gmt 0)

10+ Year Member



Im about ready to say screw the Netscape users. They only represent 3% of my traffic. If these users insist on using an inferior browser product that does not conform to CSS and HTML 4.01 then they deserve the crappy layout, they get.

If you're talking about Netscape 4, I would tend to agree with you. If you're talking about Netscape 6/7, then you're not correct in saying that the browser is "inferior" and that it does not conform - the Mozilla/Gecko browsers are the most standards-compliant out there.

As for the layout, you will probably need to use float to place the forms correctly, or use a 2 column table as you suggested. When you say "it ignores the centering", I'm not sure what you mean. Are you saying that

<td valign="top">
doesn't work, or are you talking about horizontal centering?

lgn

2:08 am on Jun 11, 2003 (gmt 0)



Finally got it to work. Inline form that will display two forms on one line for IE, NN4,6,7.

I believe whenever you use &nbsp; Netscape assumes an implied <p> which messes up the line
spacing. I forced everything in a table and used
a table cell for my inter button spacing.

I also used FORM {display: inline;} in my CSS.

My tables have no width specified as buttons are differnt sizes between Browsers, and it will mess things up if you use table widths.

Here is the code for a mulitple button 2 forms on
a single line. the class checkout is just my lock
box image that i superimpose on the checkout button.

<table BORDER="0" CELLPADDING="0" CELLSPACING="0" >
<tr>
<td valign="top">
<form METHOD="post" ACTION="../cgi-bin/script.pl">
<input type="hidden" name="page" value="%%page%%">
<input type="hidden" name="cart_id" value="%%cart_id%%">
<input TYPE="submit" NAME="modify_cart" VALUE="View / Modify Cart">&nbsp;&nbsp;
<input TYPE="submit" NAME="return_to_frontpage" VALUE="Product Line">
</form>
</td>
<td>&nbsp;&nbsp;&nbsp;</td>
<td valign="top">
<form METHOD="post" ACTION="https://www.widgets.com/cgi-bin/checkout.pl">
<input type="hidden" name="cart_id" value="%%cart_id%%">
<input type="hidden" name="page" value="%%page%%">
<input TYPE="submit" NAME="order_form" VALUE=" Checkout" class="checkout">
</form>
</td>
</tr>
</table>