473,386 Members | 1,609 Online
Bytes | Software Development & Data Engineering Community
Post Job

Home Posts Topics Members FAQ

Join Bytes to post your question to a community of 473,386 software developers and data experts.

How to increase vertical spacing of items within a <TD>?


First, I'm glad to find a newsgroup that still uses a FAQ:
http://www.htmlhelp.com/faq

The challenge:

These checkboxes (inside a table data TD tag) came out too squeezed
together (vertically) so I tried to double-space them with the CSS
"line-height" parameter. That did not work (at least for the IE
browser), so I put an extra break (BR) tag inside the TD and it works
great, but now it's a little TOO spacey.

Any ideas?
<tr>
<td>Please specify:</td>
<td>
<!-- span "line-height:1.5em;" -->
<br /><input type="checkbox" name="ckwheelc" wheelchair access<br
/><br />
<input type="checkbox" name="cksmoking" smoking allowed<br /><br />
<input type="checkbox" name="ckwc" restroom available<br />
<input type="checkbox" name="cksteps" heated area<br /><br />
<small><i>If other, you can describe it below:</i></small>
<!-- /span -->
</td>
</tr>
....or would you purists not stack things in a <TDlike this?

-------------------------

Also, thanks for posting http://css.maxdesign.com.au/listamatic/ ! A
wealth of clean HTML/CSS solutions. Very cool.

I am concerned that some of you turn JavaScript off because I use it
to verify what the user typed into form fields (to make sure there
aren't too many characters, that the email address entered looks like
an e-mail address, etc.) The only other way I can think of to verify
is to send the form back to the server. I like the idea of doing it on
the client. What method do you all favor for verification of form
answers?

Jan 10 '07 #1
3 12212
wo************@hotmail.com wrote [in part]:
First, I'm glad to find a newsgroup that still uses a FAQ:
http://www.htmlhelp.com/faq

The challenge:

These checkboxes (inside a table data TD tag) came out too squeezed
together (vertically) so I tried to double-space them with the CSS
"line-height" parameter. That did not work (at least for the IE
browser), so I put an extra break (BR) tag inside the TD and it works
great, but now it's a little TOO spacey.

Any ideas?
<tr>
<td>Please specify:</td>
<td>
<!-- span "line-height:1.5em;" -->
<br /><input type="checkbox" name="ckwheelc" wheelchair access<br
/><br />
<input type="checkbox" name="cksmoking" smoking allowed<br /><br />
<input type="checkbox" name="ckwc" restroom available<br />
<input type="checkbox" name="cksteps" heated area<br /><br />
<small><i>If other, you can describe it below:</i></small>
<!-- /span -->
</td>
</tr>
...or would you purists not stack things in a <TDlike this?
Instead of using <tableand <br>, use paragraphs. The checkboxes can
be in paragraphs with class ckbox:
p.ckbox { text-indent: 10em; margin-top: 0.5em }

Vary the indentation and margin until it looks the way you want it.

--

David E. Ross
<http://www.rossde.com/>

Concerned about someone (e.g., Pres. Bush) snooping
into your E-mail? Use PGP.
See my <http://www.rossde.com/PGP/>
Jan 10 '07 #2
Gazing into my crystal ball I observed wo************@hotmail.com writing
in news:11**********************@p59g2000hsd.googlegr oups.com:
I am concerned that some of you turn JavaScript off because I use it
to verify what the user typed into form fields (to make sure there
aren't too many characters, that the email address entered looks like
an e-mail address, etc.) The only other way I can think of to verify
is to send the form back to the server. I like the idea of doing it on
the client. What method do you all favor for verification of form
answers?

Nothing wrong with client side javascript - I think it's a nice thing to do
for the user. But, just make sure that everything is validated server side
as well.

--
Adrienne Boswell at Home
Arbpen Web Site Design Services
http://www.cavalcade-of-coding.info
Please respond to the group so others can share

Jan 10 '07 #3
Scripsit wo************@hotmail.com:
First, I'm glad to find a newsgroup that still uses a FAQ:
http://www.htmlhelp.com/faq
The group that would have been the right one for your primary question,
c.i.w.a.stylesheets, has a FAQ, too. Actually, two.
These checkboxes (inside a table data TD tag) came out too squeezed
together (vertically) so I tried to double-space them with the CSS
"line-height" parameter. That did not work
You didn't post a URL. Going thru the trouble of constructing a test page
from you sketchy code snippet, I noticed that setting line-height works just
fine. You might, however, have a different impression if you only set
line-height to 1.5em, which is not that much larger than the typical
defaults (about 1.2em to 1.3em). But this _is_ a CSS issue, not HTML.
so I put an extra break (BR) tag inside the TD and it works
great, but now it's a little TOO spacey.
You're just creating trouble that way. How many times can you break a line?
(<brmeans "line break") Some browsers think that <br><brshould create an
empty line, but that's really debatable, to put it mildly. So your HTML
approach is wrong; use CSS for styling.
<input type="checkbox" name="ckwheelc" wheelchair access
ObHTML: For accessibility, you should use <labelmarkup, e.g.

<input type="checkbox" name="ckwheelc" id="ckwheelc">
<label for="ckwheelc">wheelchair access</label>

(See "Accessibility issues of checkboxes and radio buttons",
http://www.cs.tut.fi/~jkorpela/forms/kbd.html )
I am concerned that some of you turn JavaScript off
I'm more worried about people who don't do that and might not even know how
to do that.
because I use it
to verify what the user typed into form fields (to make sure there
aren't too many characters, that the email address entered looks like
an e-mail address, etc.)
As a side note, most e-mail address verification checks reject well-formed
addresses and accept addresses that violate the e-mail address format
standard.
The only other way I can think of to verify
is to send the form back to the server.
You mean you haven't implemented such checks first? Then sit back and wait
for the first joker to submit a gigabyte of junk, using a slightly modified
copy of your page. If you're unlucky, it won't be a joker but a cracker who
submits it in a loop.

--
Jukka K. Korpela ("Yucca")
http://www.cs.tut.fi/~jkorpela/

Jan 10 '07 #4

This thread has been closed and replies have been disabled. Please start a new discussion.

Similar topics

32
by: Werner Partner | last post by:
Hier is the problem: http://asterix/sonoptikon.de/artemis/index.php The <h1> and <h2> make their ellbows so broad that in the picture arise borders on top and bottom. The general question is:...
14
by: Zenobia | last post by:
Hello folks, Is it possible to position an item within a <td> element? For instance see below. The table has multiple rows, one for each database record. Each row has 3 hrefs associated with it...
3
by: Radek | last post by:
How can I get the following to appear on just 1 line? <style type="text/css"> #center { text-align: center;} #left { text-align: left;} #right {text-align: right} </style> <table border=1...
5
by: Derek Fountain | last post by:
I have a horizontal navigation bar, which is a single row table containing the right images. It "stretches" itself across the screen using a penultimate td like this: <td width="100%"...
3
by: RC | last post by:
I have a very sime html table like <html><head><title>My Table</title> <style> input { margin: 0; padding: 0; border-width: 0; text-indet: 0; text-align: left } </style></head><body> <table...
5
by: Michael | last post by:
Hi. I need dinamically calculate input text field based on parent static TD before showing content of input. Please, advice. Michael
1
by: test9991014 | last post by:
Hi folks, I've got something like this: <table> <tr> <td>1</td> <td align=center> <input type=text> </td>
4
by: ismailc | last post by:
Hi, I need help please. In <TD> certain length/max length then force <BR> I would like within a <TD> to allow certain amount of char and then force a <br>. Is this possible, Please Assist!...
4
by: harryusa | last post by:
I am trying to center 2 images concentrically which are z-indexed to lay on top of each other making an image with a border from another image that has a transparent center. I need the images to be...
0
by: taylorcarr | last post by:
A Canon printer is a smart device known for being advanced, efficient, and reliable. It is designed for home, office, and hybrid workspace use and can also be used for a variety of purposes. However,...
0
by: aa123db | last post by:
Variable and constants Use var or let for variables and const fror constants. Var foo ='bar'; Let foo ='bar';const baz ='bar'; Functions function $name$ ($parameters$) { } ...
0
by: ryjfgjl | last post by:
In our work, we often receive Excel tables with data in the same format. If we want to analyze these data, it can be difficult to analyze them because the data is spread across multiple Excel files...
0
by: emmanuelkatto | last post by:
Hi All, I am Emmanuel katto from Uganda. I want to ask what challenges you've faced while migrating a website to cloud. Please let me know. Thanks! Emmanuel
1
by: Sonnysonu | last post by:
This is the data of csv file 1 2 3 1 2 3 1 2 3 1 2 3 2 3 2 3 3 the lengths should be different i have to store the data by column-wise with in the specific length. suppose the i have to...
0
by: Hystou | last post by:
There are some requirements for setting up RAID: 1. The motherboard and BIOS support RAID configuration. 2. The motherboard has 2 or more available SATA protocol SSD/HDD slots (including MSATA, M.2...
0
marktang
by: marktang | last post by:
ONU (Optical Network Unit) is one of the key components for providing high-speed Internet services. Its primary function is to act as an endpoint device located at the user's premises. However,...
0
by: Hystou | last post by:
Most computers default to English, but sometimes we require a different language, especially when relocating. Forgot to request a specific language before your computer shipped? No problem! You can...
0
Oralloy
by: Oralloy | last post by:
Hello folks, I am unable to find appropriate documentation on the type promotion of bit-fields when using the generalised comparison operator "<=>". The problem is that using the GNU compilers,...

By using Bytes.com and it's services, you agree to our Privacy Policy and Terms of Use.

To disable or enable advertisements and analytics tracking please visit the manage ads & tracking page.