[thelist] Moving away from layout tables

Craig Saila crsaila at yahoo.ca
Wed May 29 16:33:01 CDT 2002


Jonathan_A_McPherson at rl.gov wrote:
> In XHTML, as I understand it, tables are only to be used to present truly
> tabular data. This seems fair. But I'm having trouble getting the "nicely

One doesn't follow the other. You can do tabled layouts with XHTML, but
ditching them is more in tune with the ideas behind XHTML, i.e.,
separating presentation from structure.

As for the rest of the following, I'm not sure what browser audience you
have, but these I tested IE 6 and Netscape 6.

> -- Managing Columns --
> With tables, I'd just toss 'em in a containing <table width="100%"> and use
> <td width="33%">.

Same thing, except style the width of the form to 100% and the <fieldset>:
   FIELDSET { display: inline; width: 32%; vertical-align: top; }
(32% is used because in some quicky tests, 33% wrapped. Might have
something to do with padding or margins. "vertical-align" is used to
make sure all fieldsets are aligned to the top.)

> -- Aligning Radio Button Text --
> I want this:
> * this is some text that
>   describes the first
>   radio button
> * this is some more text
>   that describes the
>   second radio button

Try setting the bottom margin and the float property:
  <input type="radio" style="margin-bottom: 80px; float: left;">
(replace 80px with whatever is the best margin)

> -- Labels on Form Elements --
>
> I occasionally stick some text beneath a form element to help users know
> what to put in them (a short explanation of the input mask, whatever). I
> want to do something like this:

Try containing it in DIVs, and then setting the float to left:
  <div style="float: left"><input /><br /><label>text1</label></div>
  <div><input /><br />text1</div>
(the last DIV shouldn't have a float)

--
Cheers,

Craig Saila
------------------------------------------
craig at saila.com  :  http://www.saila.com/
------------------------------------------


_________________________________________________________
Do You Yahoo!?
Get your free @yahoo.com address at http://mail.yahoo.com




More information about the thelist mailing list