Posted by Christoph on 12/11/06 16:52

I have a form that looks something like this:

<form>
<fieldset>
<div><label>blah</blah><input type="blah"></div>
<div><label>blah</blah><input type="blah"></div>
<div><label>blah</blah><input type="blah"></div>
<div><label>blah</blah><input type="blah"></div>
</fieldset>
</form>

When tabbing between form elements, it focus doesn't actually go to the
next/previous element. What's happening is that focus is going to the div.
When I hit the [TAB] key from a form element, the DIV is highlighted with a
border. I have to hit [TAB] again to actually get to the next form element.
I've tried to set tab-index: none in various places but that didn't seem to
work. I tried:

BODY { tab-index: none; }

then I tried

FIELDSET { tab-index: none; }

then I tried

FORM DIV { tab-index: none; }

I also tried giving it a value of 0. I also tried fooling around with the
user-focus property, but that didn't work either.

How can I make it so that the DIVs are not given focus in the form? That
only the actual form elements get focus when tabbed to/from?

thnx,
Christoph

• Next in forum: CSS and print layout
• Prev in forum: Re: Hyperlink for entire table cell rather then just the text - how is it done?
• Thread view: CSS, DIVs, Forms and tab focus

[Reply to this message]