Tom,

HTML5 allows for the use of the elements header, footer, and aside in
multiple instances.

For example, an article could have a header and footer:

        <section>
                <article>
                        <header>
                                <h2>Article title</h2>
                                <p>August 12, 2010</p>
                        </header>
                        <p> Article copy here. Article copy here. Article
copy here. Article copy here.</p>
                        <footer>
                                <p>By: Dan Freeman</p>
                        </footer>
                </article>
        </section>

Using ID's would not help you replicate this.  You'd have to structure it
like this:

        <div class="section">
                <div class="article">
                        <div class="header">
                                <h2>Article title</h2>
                                <p>August 12, 2010</p>
                        </div>
                        <p> Article copy here. Article copy here. Article
copy here. Article copy here.</p>
                        <div class="footer">
                                <p>By: Dan Freeman</p>
                        </div>
                </div>
        </div>

Dan Freeman
Webmaster & ERP Administrator
800.650.6506 (TOLL FREE)
330.655.0341 (DIRECT)
www.lexi.com

-----Original Message-----
From: [email protected] [mailto:[email protected]] On
Behalf Of Tom Livingston
Sent: Friday, August 13, 2010 9:59 AM
To: [email protected]
Subject: Re: [WSG] Getting my feet wet in HTML5

> Ignoring that this isn't using HTML5 elements, but using it as an
> analogy - via the classes and IDs - could this be improved upon? Is
> there a place for <section>(s) here? Did I get the element concepts
> right?
>
> Thanks again...


Sorry,, Corrected Structure:

<div id="wrap">
               <div id="header">
                       <p>Header here</p>
               </div><!-- !End Header -->

               <div id="container" class="clear">
                       <div class="article">
                               Content with an H2, a UL, Ps and As and a
picture
                       </div>
                       <div class="article">
                               Content with an H2, a UL, Ps and As and a
picture
                       </div>
                       <div class="article">
                               Content with an H2, a UL, Ps and As and a
picture
                       </div>
               </div><!-- !End #container -->
               <div id="aside">
                       <p>Sidebar</p>
               </div>

               <div id="footer">
                       <p>Footer</p>
               </div><!-- !End Footer -->
       </div><!--! end of #wrap -->


-- 

Tom Livingston | Senior Interactive Developer | Media Logic |
ph: 518.456.3015x231 | fx: 518.456.4279 | mlinc.com


*******************************************************************
List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
Help: [email protected]
*******************************************************************


LEXI-COMP CONFIDENTIALITY NOTICE
The information in this electronic mail is intended for the named 
recipients only.  Any use of this information by anyone other than 
the intended receiver is prohibited.  If the reader of this message is
not the intended recipient, you are hereby notified that any 
dissemination, distribution, copying, or other use of this message 
or its attachments is strictly prohibited.  If you have received this 
message in error, please notify the sender immediately by replying 
to this electronic e-mail or by calling 330-650-6506.  Please delete 
it from your computer.  Thank you.



*******************************************************************
List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
Help: [email protected]
*******************************************************************

Reply via email to