[pmwiki-users] CSS question related to FGS

Knut Alboldt pmwiki at alboldt.de
Tue Feb 15 14:18:55 CST 2005


John Feezell schrieb:
> I'd appreciate some feedback on the following  I'm currently 
> restructuring the Form Guide System to use CSS.
> The structure within a form will be the following
> 
> wrapper
>    cue
>         field
>               input
> 
> I'm current using the following div structure
> 
> <div wrapper style='$wcss' >
>      <div cue style='$ccss' >
>              <div field style='$fcss' >
>                     <input style='$icss' >
>              </div>
>      </div>
> </div>
> 
> Is there a better way to structure the <div>s?


it would be better if you use the syntax like:

<div id="wrapper">
   or
<div class="wrapper">

and
<input id="inputfield">
   or
<input class="inputfield">
   or even:
<input id="fieldname">

This way you can "address" these sections from within external 
css-stylesheets, e.g.:

div.#idname { ...}
   or
div.classname { ...}

So one could define the styles within a css-file within a skin-dir and 
the styles would be simply cahngable by using the $Skin= variable 
without any php-coding (which is required to set $icss etc)

You can of cause still use the style="css-styles" attribute in every 
field which will overwrite any css-styles defined in an external stylesheet.

> Should I be using <p>s instead?
> 
> How do <div>s and <p>s compare?  One 'better' than the other?
<div> is just common a html-block, <p> is a "special" div for using 
paragraphs

I prefer div's or span's in combinition with the class- or id-attribute 
to define blocks in any way. But as I explain below, you can even define 
span's with div's.

> 
> If I wanted to place two divs side-by-side horizontally would that
> require a table structure?
to place elements side by side you can use
	<span>
but also
	<div style="display:inline;">
which has the same result like <span>

But: you will not have two columns in multiple lines well justified like 
in table cells. You might play around with the width-attribute (same 
value for all divs in one column) but I think it's not that flexible 
like a table whre you get the coulumnsize adapted automatically to the 
widest column-text.

Knut



More information about the pmwiki-users mailing list