By using this site, you agree to our updated Privacy Policy and our Terms of Use. Manage your Cookies Settings.
429,426 Members | 1,729 Online
Bytes IT Community
+ Ask a Question
Need help? Post your question and get tips & solutions from a community of 429,426 IT Pros & Developers. It's quick & easy.

FORMs with grid layout

P: n/a
I'm writing a form with a grid layout (similar to the ones in
phpMyAdmin). The form will contain X number of columns and Y rows - all
cells containg INPUT elements.

As long as the data isn't tabular I want to avoid tables.
Is there a smart way (DIVs and CSS) to do this form without a table?
Could I consider a form like this as tabular data, and forget making it
tableless?

Thanks,

BT

Jul 24 '05 #1
Share this Question
Share on Google+
8 Replies


P: n/a
T. Bjarne wrote:
I'm writing a form with a grid layout (similar to the ones in
phpMyAdmin). The form will contain X number of columns and Y rows - all
cells containg INPUT elements.

As long as the data isn't tabular I want to avoid tables.
Are you sure it isn't tabular, don't make the same mistake other's have [1].
Is there a smart way (DIVs and CSS) to do this form without a table?
Don't abuse divs, you can apply styles to input elements just as easily.
Why is it that so many people think they need a divs and spans when
ever they need to control layout? See the comments in [1] for some
additional discussion about faking tables.
Could I consider a form like this as tabular data, and forget making it
tableless?


It depends on the content. If you describe what it is you are trying to
markup, someone may be able to help you decide whether or not it's tabular.

Are each of the inputs that will appear in the same row (or column)
logically related as a single group, and is each row (or column) a
distinct group from the others? Does the form still make logical sense
if they aren't presented in tabular form?

[1] http://www.mezzoblue.com/archives/2005/03/31/too_far/

--
Lachlan Hunt
http://lachy.id.au/
http://GetFirefox.com/ Rediscover the Web
http://GetThunderbird.com/ Reclaim your Inbox
Jul 24 '05 #2

P: n/a

T. Bjarne schrieb:

As long as the data isn't tabular I want to avoid tables.
Is there a smart way (DIVs and CSS) to do this form without a table?
The natural choice is display: table, display table-row, display:
table-cell, of course.

In Mozilla, Firefox, other Gecko-Browsers, Opera, Konqueror, any modern
browser, this will do the job.

Unfortunately, there is one browser of a company, which does not need to
fix its CSS bugs, because the company is powerful enough to make
everybody write around them.
Hans-Joachim


--Du hast aber doch nicht ernsthaft damit gerechnet, da der I viel CSS
jenseits von "color" und "font-size" untersttzt, oder?


Wiejetz ... der IE5.x kann schon "color"? Wolfgang Krietsch
Jul 24 '05 #3

P: n/a
Gazing into my crystal ball I observed "T. Bjarne" <tb*****@yahoo.no>
writing in news:11*********************@l41g2000cwc.googlegro ups.com:
I'm writing a form with a grid layout (similar to the ones in
phpMyAdmin). The form will contain X number of columns and Y rows - all
cells containg INPUT elements.

As long as the data isn't tabular I want to avoid tables.
Is there a smart way (DIVs and CSS) to do this form without a table?
Could I consider a form like this as tabular data, and forget making it
tableless?

Thanks,

BT


I have an example that might be just the ticket:
<http://www.intraproducts.com/beta/requiredform.asp>

The scripting language is ASP, but it can be ported to whatever you need.
The CSS used the label element to give the visual structure and also is
used to alert a user that an error was made.

--
Adrienne Boswell
http://www.cavalcade-of-coding.info
Please respond to the group so others can share
Jul 24 '05 #4

P: n/a
T. Bjarne wrote:
I'm writing a form with a grid layout (similar to the ones in
phpMyAdmin). The form will contain X number of columns and Y rows - all
cells containg INPUT elements.

As long as the data isn't tabular I want to avoid tables.
Is there a smart way (DIVs and CSS) to do this form without a table?
Could I consider a form like this as tabular data, and forget making it
tableless?


If it looks better in a table, use it. It is absurd to think that
*only* 'tabular data' should be rendered in a table.

The HTML specification itself suggests as much, even suggesting the
use of nested (gasp! kill the heretic!) tables as well as using them
for laying out forms. From RFC 1942 on which the HTML 4 table model
is based:

"Tables can contain a wide range of content, such as headers,
lists, paragraphs, forms, figures, preformatted text and even
nested tables."

<URL:http://www.ietf.org/rfc/rfc1942.txt>

More information can be found on tables here:

<URL:http://www.w3.org/TR/html401/appendix/notes.html#notes-tables>

And here, where "[t]wo types of tables are discussed: tables used to
organize data, and tables used to create a visual layout of the
page."

<URL:http://www.w3.org/TR/WCAG10-HTML-TECHS/#tables>

The big issue with using tables for layout is that they can easily
break accessibility rules. If putting something into a table does
not hinder accessibility (or accessibility is suitably addressed) and
it does not create unnecessarily complex markup, there is no reason
not do it - even if what is to be displayed isn't 'tabular data'.

--
Fred
Jul 24 '05 #5

P: n/a
This CSS only works in IE.

Jul 24 '05 #6

P: n/a
Gazing into my crystal ball I observed "Toby Miller"
<tm*****@tobymiller.com> writing in news:1112632856.071456.217430
@f14g2000cwb.googlegroups.com:
This CSS only works in IE.


Yikes! You're right. I've been using this in Opera for months and never
realized that.

--
Adrienne Boswell
http://www.cavalcade-of-coding.info
Please respond to the group so others can share
Jul 24 '05 #7

P: n/a

"Fred Oz" <oz****@iinet.net.auau> wrote in message
news:42***********************@per-qv1-newsreader-01.iinet.net.au...
T. Bjarne wrote:
I'm writing a form with a grid layout (similar to the ones in
phpMyAdmin). The form will contain X number of columns and Y rows - all
cells containg INPUT elements.

As long as the data isn't tabular I want to avoid tables.
Is there a smart way (DIVs and CSS) to do this form without a table?
Could I consider a form like this as tabular data, and forget making it
tableless?


If it looks better in a table, use it. It is absurd to think that
*only* 'tabular data' should be rendered in a table.


<snip>

Thank you Fred Oz!

Carla
Jul 24 '05 #8

P: n/a
c.thornquist wrote:
"Fred Oz" <oz****@iinet.net.auau> wrote in message
news:42***********************@per-qv1-newsreader-01.iinet.net.au...
T. Bjarne wrote:
I'm writing a form with a grid layout (similar to the ones in
phpMyAdmin). The form will contain X number of columns and Y rows - all
cells containg INPUT elements.

As long as the data isn't tabular I want to avoid tables.
Is there a smart way (DIVs and CSS) to do this form without a table?
Could I consider a form like this as tabular data, and forget making it
tableless?


If it looks better in a table, use it. It is absurd to think that
*only* 'tabular data' should be rendered in a table.

<snip>

Thank you Fred Oz!

Carla


I go along with the tabular data for tables thing. To me, most of a
form *is* tabular data: question/answer. I often use tables to layout a
form as it is rediculous to do:
<form>
<div>question</div><div>answer</div>
<div>question</div><div>answer</div>
<div>question</div><div>answer</div>
<div>question</div><div>answer</div>
</form>
Actually, that doesn't even work since you need something between each
row set to {clear:both} and then you still have a problem when things
wrap making things line up incorrectly. I have done it using divs,
paragraphs, spans, etc. and keep falling back to tables because a table
makes the most sense to line things up in columns and rows (definition
of tabular data).

--
Stan McCann "Uncle Pirate" http://stanmccann.us/pirate.html
Webmaster/Computer Center Manager, NMSU at Alamogordo
Coordinator, Tularosa Basin Chapter, ABATE of NM; AMA#758681; COBB
'94 1500 Vulcan (now wrecked) :( http://motorcyclefun.org/Dcp_2068c.jpg
A zest for living must include a willingness to die. - R.A. Heinlein
Jul 24 '05 #9

This discussion thread is closed

Replies have been disabled for this discussion.