mirror of
				https://github.com/dawidolko/Website-Templates.git
				synced 2025-10-31 00:13:11 +01:00 
			
		
		
		
	
		
			
				
	
	
		
			121 lines
		
	
	
		
			4.3 KiB
		
	
	
	
		
			HTML
		
	
	
	
	
	
			
		
		
	
	
			121 lines
		
	
	
		
			4.3 KiB
		
	
	
	
		
			HTML
		
	
	
	
	
	
| <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
 | |
|     "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
 | |
| 
 | |
| <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en-AU">
 | |
| <head>
 | |
|   <meta http-equiv="content-type" content="application/xhtml+xml; charset=UTF-8" />
 | |
|   <meta name="author" content="pat" />
 | |
|   <meta name="keywords" content="site, keywords, here" />
 | |
|   <meta name="description" content="site description here" />
 | |
|   <title>drifting v1.0</title>
 | |
| 
 | |
|   <link rel="stylesheet" type="text/css" href="css/drifting_screen.css" media="screen, tv, projection" />
 | |
|   <link rel="stylesheet" type="text/css" href="css/drifting_print.css" media="print" />
 | |
| </head>
 | |
| 
 | |
| <body>
 | |
| 
 | |
| <!-- Layout container starts -->
 | |
| <div id="layoutBox">
 | |
| 
 | |
|   <!-- HEADER: controls the header layout, images, title and subTitle. -->
 | |
|   <div id="headerBox">
 | |
|     <div id="headerLeftBox">
 | |
|       <span class="title">
 | |
|         drifting v1.0
 | |
|       </span>
 | |
|       <br />
 | |
|       <span class="subTitle">
 | |
|         because shovelling hurts
 | |
|       </span>
 | |
|     </div>
 | |
|     <div id="headerRightBox">
 | |
|        
 | |
|     </div>
 | |
|   </div>
 | |
| 
 | |
|   <!-- MENU: include as many submenus as you want.  Menu groups should begin with a
 | |
|        <h1> and then all menu links need to be defined in a <div class="menuGroup">.
 | |
|        The <span class="noDisplay"> | </span> after each link only needs to be included
 | |
|        if this site will be loaded in a text only browser -->
 | |
|   <div id="menuBox">
 | |
|     <h1>
 | |
|       menu 1
 | |
|     </h1>
 | |
|     <div class="menuGroup">
 | |
|       <a href="clean.html" title="menu item"><img src="images/menu_icon.gif" alt="menu item 1" /> item 1</a><span class="noDisplay"> | </span>
 | |
|       <a href="clean.html" title="menu item"><img src="images/menu_icon.gif" alt="menu item 2" /> item 2</a><span class="noDisplay"> | </span>
 | |
|       <a href="clean.html" title="menu item"><img src="images/menu_icon.gif" alt="menu item 3" /> item 3</a><span class="noDisplay"> | </span>
 | |
|       <a href="clean.html" title="menu item"><img src="images/menu_icon.gif" alt="menu item 4" /> item 4</a><span class="noDisplay"> | </span>
 | |
|     </div>
 | |
| 
 | |
|     <h1>
 | |
|       menu 2
 | |
|     </h1>
 | |
|     <div class="menuGroup">
 | |
|       <a href="clean.html" title="menu item"><img src="images/menu_icon.gif" alt="menu item 1" /> item 1</a><span class="noDisplay"> | </span>
 | |
|       <a href="clean.html" title="menu item"><img src="images/menu_icon.gif" alt="menu item 2" /> item 2</a><span class="noDisplay"> | </span>
 | |
|       <a href="clean.html" title="menu item"><img src="images/menu_icon.gif" alt="menu item 3" /> item 3</a><span class="noDisplay"> | </span>
 | |
|       <a href="clean.html" title="menu item"><img src="images/menu_icon.gif" alt="menu item 4" /> item 4</a><span class="noDisplay"> | </span>
 | |
|     </div>
 | |
| 
 | |
|     <!-- NEWS: define news chunks in <p> and use <h2> for the date/title -->
 | |
|     <h1>
 | |
|       news
 | |
|     </h1>
 | |
|     <div class="newsGroup">
 | |
|       <h2>news heading</h2>
 | |
|       <p>
 | |
|         news item
 | |
|       </p>
 | |
|     </div>
 | |
| 
 | |
|     <!-- MENU FOOTER: could include a site search field here -->
 | |
|     <div class="menuFooter">
 | |
| 	   
 | |
|     </div>
 | |
| 
 | |
|   </div>
 | |
| 
 | |
|   <!-- MAIN CONTENT : to add new headings, include a <h1> and then as many <p> blocks
 | |
|        as you'd like.  <h2> will create subheadings. To finish a section, include a
 | |
|        <br/> to clearly define it. -->
 | |
|   <div id="mainContent">
 | |
| 
 | |
|     <h1>section 1</h1>
 | |
|     <p>
 | |
|       Content here.
 | |
|     </p>
 | |
| 
 | |
|     <h1>section 2</h1>
 | |
|     <h2>sub section 1</h2>
 | |
| 
 | |
|     <p>
 | |
|       More content here.
 | |
|     </p>
 | |
| 
 | |
| 
 | |
|     <h2>seb section 2</h2>
 | |
|     <p>
 | |
|       Even more content here.
 | |
|     </p>
 | |
|     <br />
 | |
| 
 | |
|     <!-- FOOTER: whatever you want in here - maybe a last updated or breadcrumb? -->
 | |
|     <div class="footer">
 | |
|       valid <a href="http://validator.w3.org/check/referer" title="validate markup">XHTML</a> / <a href="http://jigsaw.w3.org/css-validator/check/referer" title="validate CSS">CSS</a> <br />
 | |
|       last updated / copyright here | design by <a href="http://openwebdesign.org/userinfo.phtml?user=snop" title="OWD profile / contact">snop</a>
 | |
|     </div>
 | |
|   </div>
 | |
| 
 | |
|   <!-- BUG FIX: This corrects another IE rendering bug....  You notice it only when the menu container length is
 | |
|        greater than the main content container.  Without this, when an a:hover is triggered in the main container,
 | |
|        IE reflows the page and cuts off the menu at the bottom of the main container. -->
 | |
|   <div class="spacer">
 | |
|   </div>
 | |
| 
 | |
| </div>
 | |
| <!-- Layout container ends -->
 | |
| 
 | |
| </body>
 | |
| </html> |