?
Solved

Can you help tighen up this cell?

Posted on 1999-11-28
7
Medium Priority
?
166 Views
Last Modified: 2012-05-07
I need to tighten up the two buttons in this table cell on this url, (under construction, so the page is a bit messy)

http://www.healthwatchce.com/summary.htm

I want the buttons on the first row "which say "Click to order this course" and the button below it "Click for more info", to be as tight as the two buttons which are directly below them.

The top row features a button within a form, and the button below will just be a link.  

But putting the top button in the form seems to cause this wide space between the two buttons.

I hope I'm clear!

Needs to look good in 3.x browsers to current browsers -- netscape & explorer.

Thanks

Rowby
 
0
Comment
Question by:Rowby Goren
7 Comments
 

Accepted Solution

by:
Qxm earned 200 total points
ID: 2239641
Here is the code that should do what you want:

<input TYPE="image" img src="images/clicktoorder2.gif" NAME="add_to_cart" VALUE="Click to order this course" alt="Click HERE to Buy Now!" WIDTH="80" HEIGHT="31">    </form><br><img src="images/clickmoreinfo2.gif" alt="CLICK for more informaiton on this course" WIDTH="80" HEIGHT="31"></td>
0
 
LVL 4

Expert Comment

by:chewymon
ID: 2239646
The HEIGHT and WIDTH are creating a hidden field that surronds the image.  This spaces the next one farther away.


<input TYPE="image" img src="images/clicktoorder2.gif" NAME="add_to_cart" VALUE="Click to order this course" alt="Click HERE to Buy Now!" WIDTH="80" HEIGHT="31">
0
 

Expert Comment

by:Qxm
ID: 2239689
actually it was that he had <p>'s around each individual image so that they were spaced away from each other.  I just took out the <p>'s and put a <br> between the images instead.
0
Never miss a deadline with monday.com

The revolutionary project management tool is here!   Plan visually with a single glance and make sure your projects get done.

 
LVL 4

Expert Comment

by:oubelkas
ID: 2240364
Qxm >> Actually what you proposed as an answer isn't correct. Because you didn't fix the problem with the form.
chewymon >> also what you said isn't actually true.

The problem here is that the form tags are placed within the <TD> tags. Then a blank space is created after the form is interpreted. So THE solution to this is putting the form tags outside the TD tags. Use the <BR> tag after each image to put them together. So this results in:

<form METHOD="POST" ACTION="cgi-bin/quikstore.cgi">
      <td valign="top" height="63" width="164">
      <input type="hidden" name="item-REG-F-|74.00|Regulations Pertaining to the Dental Profession|NA|NA" value="1"><input TYPE="image" img src="images/clicktoorder2.gif" NAME="add_to_cart" VALUE="Click to order this course" alt="Click HERE to Buy Now!" WIDTH="80" HEIGHT="31"><br>
      <img src="images/clickmoreinfo2.gif" alt="CLICK for more informaiton on this course" WIDTH="80" HEIGHT="31">
      </td>

in your code

Joseph
    </form>
0
 
LVL 4

Expert Comment

by:oubelkas
ID: 2240369
mmm, the </form> tag must be after </td>
0
 

Expert Comment

by:DokiDoki
ID: 2244792
Simply put, the </form> tag causes a line break. Put it between </tr> and </td> or between </table> and </tr>. This will supress the line break in almost any browser.

Example

<table>
  <form>
  <tr>
    <td>
      image<br>
    </td>
    <td>
      image2<br>
    </td>
  </tr>
  </form>
</table>
0
 
LVL 4

Expert Comment

by:oubelkas
ID: 2245930
DokiDoki>> oink, oink, check my comment...
0

Featured Post

The new generation of project management tools

With monday.com’s project management tool, you can see what everyone on your team is working in a single glance. Its intuitive dashboards are customizable, so you can create systems that work for you.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

This article describes how to create custom column layout styles for Bootstrap. The article uses 5 columns to illustrate the concept, but the principle can be extended to any number of columns.
There's never been a better time to become a computer scientist. Employment growth in the field is expected to reach 22% overall by 2020, and if you want to get in on the action, it’s a good idea to think about at least minoring in computer science …
In this tutorial viewers will learn how to code links for mobile sites that, once clicked, send a call or text to a specified number. For a telephone link (once clicked, calls a number), begin with a normal "<a href=" link tag. For the href, specify…
The viewer will the learn the benefit of plain text editors and code an HTML5 based template for use in further tutorials.

589 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question