Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Page 1 of 2 12 LastLast
Results 1 to 15 of 27
  1. #1
    New Coder
    Join Date
    Nov 2003
    Posts
    65
    Thanks
    1
    Thanked 0 Times in 0 Posts

    Is this semantically correct usage of a table?

    Just wondering, as I have no idea, although from what I understand it is really a personal opinion.

    Code:
    <form name="nAdd" action="url" method="post">
    		<table>
    			<tr>
    				<td><label for="nTitle">News Title : </label></td>
    				<td><input name="nTitle" id="nTitle" type="text" /></td>
    			</tr>
    			<tr>
    				<td><label for="nArticle">News Article : </label></td>
    				<td><textarea name="nArticle" id="nArticle" cols="25" rows="10"></textarea></td>
    			</tr>
    			<tr>
    				<td><input name="nSubmit" id="nSumbit" value="Add Item" /></td>
    				<td>&nbsp;</td>
    			</tr>
    		</table>
    </form>
    TIA!

  • #2
    IBM
    IBM is offline
    New Coder
    Join Date
    Jul 2002
    Posts
    42
    Thanks
    0
    Thanked 0 Times in 0 Posts
    well, it really depends on how standards compliant you want to be.

    If you want to code in xhtml then no, it isn't correct usage.
    Tables should be used to display data, not used for layouts.
    Think spread sheets.

    Now, if you want to code in HTML, then it's fine.
    XHTML is the new standard, as opposed to HTML.

  • #3
    me'
    me' is offline
    Senior Coder
    Join Date
    Nov 2002
    Location
    Warwickshire, England
    Posts
    1,229
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Originally posted by IBM
    If you want to code in xhtml then no, it isn't correct usage.
    Tables should be used to display data, not used for layouts.
    Think spread sheets.
    1. Semantics has nothing to do with how standards compliant your code is.
    2. There's no semantic difference between xhtml and html.
    3. Some people (Skyzyx?) argue that laying out forms is a good semantic use of tables, and I sit on the fence. If you find it easier with tables, fine, but if you fancy your chances with CSS, go for it. I generally go for the latter.
    David House - Perfect is achieved, not when there is nothing left to add, but when there is nothing left to take away. (Antoine de St. Exupery).
    W3Schools | XHTML Validator | CSS Validator | Colours | Typography | HTML&CSS FAQ | Go get Mozilla Now | I blog!

  • #4
    Senior Coder
    Join Date
    Jun 2002
    Location
    near Oswestry
    Posts
    4,508
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Laying out forms is not an appropriate use of tables - a form element is not a cell of data, it's a form element. Forms may often be visually similar to tabular data in their layout, but nonetheless they're not tabular data.

    So no, it isn't.

    I've found the easiest way to lay out forms is to float the <label>
    "Why bother with accessibility? ... Because deep down you know that the web is attractive to people who aren't exactly like you." - Joe Clark

  • #5
    Regular Coder
    Join Date
    Dec 2002
    Location
    France
    Posts
    522
    Thanks
    0
    Thanked 0 Times in 0 Posts

    here's

    here's (I think) what says Brothercake .. I use it too
    Code:
    <?xml version="1.0" encoding="iso-8859-1"?>
    
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml"  xml:lang="fr">
    	<head>
    	<meta http-equiv="content-type" content="text/html; charset=iso-8859-1" />
    		<title>Form + Label</title>
    		<style type="text/css" media="screen">
    label,input {
    	display: block;
    	width: 150px;
    	float: left;
    	margin-bottom: 10px;
    	
    }
    label {
    	text-align: right;
    	width: 75px;
    	padding-right: 20px;
    }
    br
    {
    clear: left;
    }
    </style>
    
    	</head>
    	<body>
    		<form id="MainForm">
    		<label for="name">Name</label>
    		<input id="name" /><br />
    
    		<label for="address">Address</label>
    		<input id="address"  /><br />
    
    		<label for="city">City</label>
    		<input id="city"  /><br />
    		</form>
    	</body>
    </html>

  • #6
    Regular Coder
    Join Date
    Dec 2002
    Location
    France
    Posts
    522
    Thanks
    0
    Thanked 0 Times in 0 Posts

    PS

    if anyone knows a way to avoid <br /> tag ??

  • #7
    New Coder
    Join Date
    Nov 2003
    Posts
    65
    Thanks
    1
    Thanked 0 Times in 0 Posts
    <p></p>

    That's what I used to separate them. And I did what brothercake suggested.

  • #8
    me'
    me' is offline
    Senior Coder
    Join Date
    Nov 2002
    Location
    Warwickshire, England
    Posts
    1,229
    Thanks
    0
    Thanked 0 Times in 0 Posts
    You don't have to use <p> or <br/> at all. If you want to be semantic and need a tag, consider <fieldset>. I don't use it at all. Here's some sample code I used when laying out the form in my CMS:
    Code:
    form { padding: 10px }
    form * {
      display: block;
      float: left;
      margin-bottom: .7em;}
    form label {
      clear: left;
      margin-right: 1em;
      border: 0;}
    XHTML:
    Code:
      <form method="POST" action="cms-calls.php">
        
        <label for="title">Title:</label>
        <input type="text" name="title" size="30" tabindex="1"/>
        
        <label for="post">Post:</label>
        <textarea name="post" rows="10" cols="50" tabindex="2"></textarea>
        
        <input type="submit" value="Submit"/>
      </form>
    Last edited by me'; 12-29-2003 at 09:53 AM.
    David House - Perfect is achieved, not when there is nothing left to add, but when there is nothing left to take away. (Antoine de St. Exupery).
    W3Schools | XHTML Validator | CSS Validator | Colours | Typography | HTML&CSS FAQ | Go get Mozilla Now | I blog!

  • #9
    Regular Coder
    Join Date
    Dec 2002
    Location
    France
    Posts
    522
    Thanks
    0
    Thanked 0 Times in 0 Posts
    when you are using Microsoft Net language you cannot do so , as far as you can have only one form tag per page

    I use fieldset or div

    but of course to have the render in the easiest way the best is to use table ....

  • #10
    Regular Coder Skyzyx's Avatar
    Join Date
    Aug 2002
    Location
    Silicon Valley, CA
    Posts
    980
    Thanks
    0
    Thanked 0 Times in 0 Posts
    For the first time ever (I believe), I'm going to have to outright disagree with Brothercake.

    I'm all-for using CSS for layouts. Anyone who's shared a thread with me should know this. If you choose to go about displaying forms using only CSS, fantastic! I'm all for it! Wonderful, you're well on your way!

    With that being said, I still stand by the opinion that forms are still tabular data. If you think of it like a spreadsheet (which is basically what tables are), you have two sets (columns) of fields. The first is the type of data being requested, while the other is the data to be entered. This seems like a very logical, semantic way of displaying forms. It has the side-benefit of laying them out in an aesthetically pleasing manner.

    I must admit that I haven't looked into <fieldset> or <label> yet, so maybe the advent of these tags may hold improved semantics for form elements (I'm sure they do), but I still believe that although not as good as using these two tags, form elements (in a simple, logical, column-to-column manner) are still valid tabular data.

    Creator of SimplePie and Tarzan AWS, co-founder of WarpShare, co-built the Y! Messenger website, usability-focused, and an INFJ personality.

  • #11
    New Coder
    Join Date
    Nov 2003
    Posts
    65
    Thanks
    1
    Thanked 0 Times in 0 Posts
    Originally posted by Skyzyx
    The first is the type of data being requested, while the other is the data to be entered.
    That is how I thought of it, but I also know I am lazy and that I make up reasons to not have to figure out a better/ the proper way of doing something.

  • #12
    Senior Coder missing-score's Avatar
    Join Date
    Jan 2003
    Location
    UK
    Posts
    2,194
    Thanks
    0
    Thanked 0 Times in 0 Posts
    i have to agree with brothercake, I dont think that forms represent tabular data and therefore shouldnt be laid out using tables.

  • #13
    Regular Coder Skyzyx's Avatar
    Join Date
    Aug 2002
    Location
    Silicon Valley, CA
    Posts
    980
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Well then I guess that our two camps are just going to have to agree to disagree.

    Creator of SimplePie and Tarzan AWS, co-founder of WarpShare, co-built the Y! Messenger website, usability-focused, and an INFJ personality.

  • #14
    Senior Coder
    Join Date
    Jun 2002
    Location
    near Oswestry
    Posts
    4,508
    Thanks
    0
    Thanked 0 Times in 0 Posts
    A spreadsheet is not a form - it may have architectural similarities (eg, the ability to type into its elements) - but it is not a form, it's a table, like a database.

    Tabular data has a 2-dimensional structure; the structure is semantic because it's part of the way the data is comprehended - tabular data is in rows and columns.

    Forms do not have a 2-dimensional structure, they are linear - labelA/elementA, labelB/elementB, and so on - any 2d structure you impose on them is visual, not semantic.

    Originally posted by Skyzyx
    For the first time ever (I believe), I'm going to have to outright disagree with Brothercake.
    I know it seems as though we have each other over the same barrel; but it just seems that way
    Last edited by brothercake; 12-30-2003 at 03:21 AM.
    "Why bother with accessibility? ... Because deep down you know that the web is attractive to people who aren't exactly like you." - Joe Clark

  • #15
    Senior Coder missing-score's Avatar
    Join Date
    Jan 2003
    Location
    UK
    Posts
    2,194
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Originally posted by Skyzyx
    Well then I guess that our two camps are just going to have to agree to disagree.
    its better than everyone having the same views. Else how would we ever progress in technology.

    In reply to brothercakes post, that really explained it well. Its made it make much more sense to me now. Thanks.


  •  
    Page 1 of 2 12 LastLast

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •