FreeLists / dokuwiki / [dokuwiki] Re: Leaner HTML Markup

[Michael Klier <chi@xxxxxxxxxxx>]

fantasai wrote:
> fantasai wrote:
> Some examples, as requested:
> 
> <h1><a name="playground" id="playground">PlayGround</a></h1>
> <div class="level1">
>   <p>paragraph</p>
>   <ul>
>   <li class="level1"><div class="li">list item</div>
>   </li>
>   </ul>
> </div>
> 
> I would ideally write as
> 
> <div class="section" id="playground">
>   <h1>PlayGround</h1>
>   <p>paragraph</p>
>   <ul>
>     <li>list item</li>
>   </ul>
> </div>
> 
> The two losses of functionality above are:
>   - ID targetting doesn't work in older browsers (NS4 and below)
>     An alternative would be to keep the anchor on the heading.
>   - Can't style the list marker differently, would have to use
>     list-style-image for the blue boxes. An alternative would be
>     to add back an unclassed <div> and style it with li > div.

Not quite, removing the anchor link from the header will render the TOC
useless as well.

The list styling issue is disputable, and has been discussed a couple of times
already (IIRC).

> Additional functionality given by the better section structure
> is that you can, e.g. put a box around the entire section, or
> style it with :target
> 
>   :target { border: solid; } /* Put a border around the section
>                                 when it is our link target */

You can have "boxed content" by using a plugin like divspan, or box. I know
that would add another div, so it's maybe not what you would prefer ;-).

> (If sections are indented, outdenting the section header can be
> done with negative margins.)

I generally don't like negative margins, I see them rather as a hack than
propper CSS. Also browsers tend to interpret margin values not 100% equally.

Among that I think it's semantically more correct to use:

    headline
    div+indent level
    paragraph

instead of:
    
    div+indent level
    headline + negative indent level
    paragraph

If these two are the only examples I don't see big use in both of them.

Regards,
    Chi

-- 
Michael Klier

www:    http://www.chimeric.de
jabber: chi@xxxxxxxxxxxxxxxxxx
key:    http://downloads.chimeric.de/chi.asc
key-id: 0x8308F551