div within fieldset - validation error advice

R

RobM

Hiya Folks

Have a form - tableless - whose syntax I've used from a web example; uses
divs around each label and assoc input field which is positioned on each
line. Looks fine, trouble is, the validator doesnt like the div in the
fieldset ( I assume thats the prob "document type does not allow element
"DIV" here").

URL is http://users.bigpond.net.au/snootfrog/wip/common/test.html

Scuse the CSS file - its a WIP and contains a lot of other stuff that will
be cut down (yeah OK, I should start from scratch! And stuff starting with X
ignore). Anyfrog; Q is - do you think I should replace the divs (well, got
to get it validating!!) with spans with a class that is added to the excerpt
from my CSS file
(http://users.bigpond.net.au/snootfrog/wip/framework/vol00.css) below.

label, fieldset div.cr p {
margin: 0;
display: block;
width: 5em;
float: left;
}

Thanks
Rob
Melbourne (brrrr.. reaches for single malt)
 
R

RobM

RobM said:
Hiya Folks
Q is - do you think I should replace the divs (well, got
to get it validating!!) with spans with a class that is added to the excerpt
from my CSS file
(http://users.bigpond.net.au/snootfrog/wip/framework/vol00.css) below.

label, fieldset div.cr p {
margin: 0;
display: block;
width: 5em;
float: left;
}

Sorry - I copied the wrong bit of CSS; the section I mean is below (reaches
for more malt...)

fieldset div {
clear: both;
margin: .1em 0;
position: relative;
}
 
J

Jukka K. Korpela

RobM said:
the validator doesnt like the
div in the fieldset ( I assume thats the prob "document type does not
allow element "DIV" here").

Your assumption is wrong. You are supposed to check HTML syntax from
references and specifications, instead of making guesses.

The syntax of <fieldset> requires that the first element is a <legend>
element. That's why the validator says <div> is not allowed - it wouldn't
allow any other element either, except for <legend>.

You _could_ use
<legend>Please enter your User Id and Password to log in</legend>
or maybe
<legend>Information for logging in</legend>

On the other hand, maybe you don't need <fieldset> at all. After all,
it's for grouping fields, and now all the fields would appear inside one
group. So you could have just a few said:
Scuse the CSS file

The CSS file is absolutely irrelevant to the validation issue.
 
R

RobM

brucie said:
In alt.html RobM said:


· no need to use tabindex
· don't use autocomplete off, let the visitor make that decision for
themselves.

http://moreshit.usenetshit.info/login-form-thingy.shit

Thanks Brucie.. The label/inputs arent on the same line but I'll have a go
at adjusting with the direction you've sent me.
· don't use autocomplete off, let the visitor make that decision for
themselves.

I agree about the user preferences... 2 minds about this (its the only thing
that normally stops my stuff validating). I only put it on the login page
for security so IE doesnt provide the last person's login on the same PC
when they start entering the userId field. A valid exception to this rule?
(thinks....) I guess that is up to the user to look after their own
security, and its something I could warn about on the page.

Cheers
RobM
Melbourne
 
B

brucie

In alt.html RobM said:
Thanks Brucie..
kissy

The label/inputs arent on the same line

that was deliberate so they lined up and looked all pretty
but I'll have a go at adjusting with the direction you've sent me.

remove display:block; from the <input>s inside the <label>s leave it on
I agree about the user preferences...
good

I only put it on the login page for security so IE doesnt provide the
last person's login on the same PC when they start entering the
userId field. A valid exception to this rule?

no, stop trying to control what you think the visitor wants/needs.
(thinks....) I guess that is up to the user to look after their own
security,
yes.

and its something I could warn about on the page.

if you like but they should already know.
 
R

RobM

Jukka K. Korpela said:
RobM said:
the validator doesnt like the
div in the fieldset ( I assume thats the prob "document type does not
allow element "DIV" here").

Your assumption is wrong. You are supposed to check HTML syntax from
references and specifications, instead of making guesses. [1]
The syntax of <fieldset> requires that the first element is a <legend>
element. That's why the validator says <div> is not allowed - it wouldn't
allow any other element either, except for <legend>.

You _could_ use
<legend>Please enter your User Id and Password to log in</legend>
or maybe
<legend>Information for logging in</legend>

On the other hand, maybe you don't need <fieldset> at all. After all,
it's for grouping fields, and now all the fields would appear inside one


The CSS file is absolutely irrelevant to the validation issue.


Thanks Jukka/Yucca for the input, appreciated.

[1] Yes thats true, wasnt being lazy, I normally do - I stopped there and
thought I'd see what people thought about what I was trying to do.

I'm going to trim it without the fieldsets etc and see how I go. Sounds
smaller and better, especially if I want to keep the form graphical layout
(Brucie's example is great, but the legend may clash with my form border
page style). You're right, perhaps I dont need it.

Thanks for the time spent with the reply
Rob
 
K

Kris

RobM said:
Have a form - tableless - whose syntax I've used from a web example; uses
divs around each label and assoc input field which is positioned on each
line. Looks fine, trouble is, the validator doesnt like the div in the
fieldset ( I assume thats the prob "document type does not allow element
"DIV" here").

URL is http://users.bigpond.net.au/snootfrog/wip/common/test.html

<span class="formTitle1">Please enter your User Id and Password to log
in</span>

Should be

<legend>Please enter your User Id and Password to log in</legend>

Fix the heading structure on your page: <h1>Login page</h1>, <p>Only
authorised...</p>

<form ... autocomplete="off">

My browser has this great feature of autocompleting forms, even password
fields if I allow it, so I won't have to remember all my different
credentials. You however try to turn that off, would I be a visitor of
your site.
label, fieldset div.cr p {
margin: 0;
display: block;
width: 5em;
float: left;
}

When an element is being floated, it automatically becomes block level.
The display property is not needed in this case.
 
R

RobM

Kris said:
<span class="formTitle1">Please enter your User Id and Password to log
in</span>

Should be

<legend>Please enter your User Id and Password to log in</legend>

Fix the heading structure on your page: <h1>Login page</h1>, <p>Only
authorised...</p>

<form ... autocomplete="off">

My browser has this great feature of autocompleting forms, even password
fields if I allow it, so I won't have to remember all my different
credentials. You however try to turn that off, would I be a visitor of
your site.


When an element is being floated, it automatically becomes block level.
The display property is not needed in this case.

Dank U Kris.

The heading structure - thats interesting... "Login Page" should be <h1>
instead of the name of the site (which is what I already have in h1)? And
yes, 'only authorised...' is not a heading.

Point taken about the autocomplete.

Thanks for the float info.

Cheers
Rob
 
K

Kris

Fix the heading structure on your page: <h1>Login page</h1>, <p>Only
authorised...</p>
[/QUOTE]
The heading structure - thats interesting... "Login Page" should be <h1>
instead of the name of the site (which is what I already have in h1)?

I didn't notice you already had a H1. In that case the H1 I mentioned
becomes a H2.

I am however one of those who disagrees on putting a H1 on website
logos/names. If you would compare it to structuring a report in a
program like MS Word, one would rarely put the company's name in the
main heading.
And
yes, 'only authorised...' is not a heading.

If you want that text to be more obvious, more 'important' or stressed
out, using the STRONG element would be a solution.
 
R

RobM

I am however one of those who disagrees on putting a H1 on website
logos/names. If you would compare it to structuring a report in a
program like MS Word, one would rarely put the company's name in the
main heading.
[/QUOTE]

Agreed... I started to wonder, as every page will have the same <h1>, not
good for searching etc. The only thing that's lead me to leave it though, is
it will never be indexed as all these pages are JSP and will be served
dynamically. Still, I guess to be pedantic (or correct? *grin*) perhaps the
current h1 should just be classed span/div text and the name of the page
(e.g. login page, enquiries... etc) should be the main heading - which
_will_ change. This agrees with your Word comparison.

Thanks for the input (now I sound like something out of that movie Short
Circuit!)
Rob
 
R

RobM

brucie said:
In alt.html RobM said:


kissy

Stop that... there's strange lip marks on my whisky glass...
that was deliberate so they lined up and looked all pretty


remove display:block; from the <input>s inside the <label>s leave it on
for the submit <input>

Thanks - blimey that now looks concise (not uploaded).

Cheers
Rob

 
R

RobM

brucie said:
In alt.html RobM said:


that was deliberate so they lined up and looked all pretty


remove display:block; from the <input>s inside the <label>s leave it on
for the submit <input>

Hmmm... dont want to be a pain, but anyone know how to line up the input
fields (sort of like 2 columns, labels and inputs). That was what I was
originally doing with the divs. Shame, coz this does look
simpler...http://users.bigpond.net.au/snootfrog/wip/brucieform.html
(although we these folks help my original effort now validates and is much
cleaner.. I still have divs around the label/input pairs tho until I know
how to line up the inputs (another page will have quite a few fields so will
look better if lined up).

thks to Brucie for the example
Cheers
Rob
Melbourne
 
R

RobM

Hmmm... dont want to be a pain, but anyone know how to line up the input
fields (sort of like 2 columns, labels and inputs). That was what I was
originally doing with the divs. Shame, coz this does look
simpler...http://users.bigpond.net.au/snootfrog/wip/brucieform.html
(although we these folks help my original effort now validates and is much
cleaner.. I still have divs around the label/input pairs tho until I know
how to line up the inputs (another page will have quite a few fields so will
look better if lined up).

thks to Brucie for the example
Cheers
Rob
Melbourne

unless it's just OE (I should use Opera's reader, I used it for browsing) I
dont see the URL clearly - sorry. Here goes again.

http://users.bigpond.net.au/snootfrog/wip/brucieform.html

Rob
 
K

Kris

I am however one of those who disagrees on putting a H1 on website
logos/names. If you would compare it to structuring a report in a
program like MS Word, one would rarely put the company's name in the
main heading.
[/QUOTE]
Agreed... I started to wonder, as every page will have the same <h1>, not
good for searching etc. The only thing that's lead me to leave it though, is
it will never be indexed as all these pages are JSP and will be served
dynamically.

Search engine bots don't know and don't care. They get HTML,
well-formed, valid HTML even (after you fix the errors). Don't expect
your website not to be indexed after you bring the word out. Unless
ofcourse you make it impossible for them to index it.
Still, I guess to be pedantic (or correct? *grin*) perhaps the
current h1 should just be classed span/div text and the name of the page

Could be. There is no LOGO element, so I suppose DIV is good enough.
(e.g. login page, enquiries... etc) should be the main heading - which
_will_ change. This agrees with your Word comparison.

In reality, most people don't use structural styling for their Word
documents; they simply enlarge font size for selected text and set it to
bold. The same practice as the way most (clueless) web designers make
websites.
 
A

Adrienne

In reality, most people don't use structural styling for their Word
documents; they simply enlarge font size for selected text and set it to
bold. The same practice as the way most (clueless) web designers make
websites.

I've always used structural styling for word processor documents. I
started with Multimate, and then Word Perfect for DOS. It was easier to
put structure into a document than a lot of bolds and font sizes, just like
it's easier to do with HTML. Even though I use Windows now, I still use
structural styling, it's easier.
 
B

brucie

In alt.html rf said:
Why are all your links giving me a 404 brucie?

i've already done the housekeeping and deleted them. everyone except
some people who ran run off to their private county retreat have already
seen them.
 

Members online

No members online now.

Forum statistics

Threads
473,764
Messages
2,569,567
Members
45,041
Latest member
RomeoFarnh

Latest Threads

Top