After a few days on and off, I think I need some advice outside the box on this one.
Three column form, left, middle, and right. I am using a <ol> for the form, to give me some layout control, and an <ol> to me seems somewhat semantically correct, as they are numbered, which could help a screen ready go through them in a sensical way. Simplified sample http://dl.getdropbox.com/u/340087/Drops/09.21.09/css-0a71735f-124307.html Here is how I have done it: <form action="#"> <fieldset> <legend>Join Form</legend> <ol> <li> <label for="user">User</label> <input type="text" name="user" class="middle" id="user" /> <div class="right">enter in a user</div> </li> .... two more <li> blocks after, and a submit button </ol> </fieldset> </form> I want them to line up, left, middle, right, on one line. This means I set the div.right to display: inline-block; which works fine. Problem is, I need it display: inline-block; and also hidden, in order for jQuery to be able to show it on focus of the input. If I set div.right to display: none;, then jQuery will work, but it shows as inline, with no block, dropping it to the next line. Stumped... I am now using jQuery to hide div.right, but that is not the best way, as on a slow connection, it could flicker in the content before it is hidden. -- Scott * If you contact me off list replace talklists@ with scott@ * ______________________________________________________________________ css-discuss [[email protected]] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
