[Typo3-dev] any extension developers need html/css templating?

Christopher tombedlam at yahoo.com
Wed Nov 17 18:18:10 CET 2004


Hi,

--- Kasper Skårhøj <kasper2004 at typo3.com> wrote:

> I'm curiuos.
> 
> - What is complex about the CSS in the extensions? (examples)
> - What is the difference between "complex" and "sophisticated" CSS
> (which you propose is better)?
> 

Well, it's when extensions are developed using a separate css class for
every block-level element in the extension's output. This is utterly
unnecessary.

With a bit of planning, you can style (e.g.) a table that might look
like this:

<table class="tx-my-extension-table">
  <tr class="tx-my-extension-tr1">
    <td class="tx-my-extension-td-header">
      Header
    </td>
  </tr>
  <tr class="tx-my-extension-tr2">
    <td class="tx-my-extension-td">
      Content
    </td>
  </tr>
</table>

...like this:

<table class="tx-my-extension-table">
  <tr>
    <th>
      Header
    </th>
  </tr>
  <tr class="alternate">
    <td>
      Content
    </td>
  </tr>
</table>

The css file would look something like this:

table.tx-my-extension-table {}

table.tx-my-extension-table th {/* Use <th> for table headers instead
of styling up a <td> to do it... */}

table.tx-my-extension-table td {}

.alternate {/* This could be a generic class used for alternating
colors all over the site, much like the global wraps available in some
extensions */}

Using this kind of method, you can still style extension output *very*
specifically, and you can do it without cluttering up code and
stylesheet with extra classes. Moreover, if you want to let global
styles for tables, table cells and table headers to style the
extension's table on your site, your markup doesn't contain all sorts
of excess stuff.

For me, when it comes to maintenance of sites, this relative simplicity
is very valuable.

-Christopher




		
__________________________________ 
Do you Yahoo!? 
The all-new My Yahoo! - Get yours free! 
http://my.yahoo.com 
 





More information about the TYPO3-dev mailing list