Arthemia

Arthemia is fixed width and a little bit narrow.

Download Arthemia from drupal.org/project/arthemia. This version is 6.x-1.0 from 2009-Aug-12, a 29.19 KB download.

Validation

The W3C and Total Validator agree this is valid XHTML 1.0 Strict. Total Validator passes this theme as WCAG (WAI) compliant at level A and picks up the following level AA error. Total Validator and Cynthia Says agree this theme is US 508 compliant as far as a computer can check. Wave did not detect accessibility errors.
WCAGv1 13.1 (AA) Use the 'title' attribute to distinguish between different links that use the same link text:
<a href="http://drupal.org/project/arthemia">Arthemia</a>

The CSS validates as CSS 3.

The CSS has the following errors when validated as CSS 2.1. The theme author says the last-child element is used in nested menus. If you have nested menus and they do something strange, you might have a browser that does not support CSS 3.
http://d-theme.com/sites/all/themes/arthemia/style.css
105 #content h1, #content h2, #content h3, #content h4 Property text-shadow doesn't exist in CSS level 2.1 but exists in [css2, css3] : #bbb 1px 1px 2px
523 Unknown pseudo-element or pseudo-class :last-child

Width

Notice the site name wrapping into two lines. You can fix the problem by changing #logo in style.css from 350px to 450px. Use Firefox Firebug to experiment with width changes.

Can this theme go wide or fluid? The content column is 590 pixels narrow, just not wide enough for content on many sites. You can increase the width but making the theme fluid is more complicated.

In style.css, change #head from 960px to 1160px to see the heading spread out. You can also delete the width to make the heading fluid. The two lines of menu will spread out into one long line with a funny indentation part way.

Change #page from 940px to 1140px to spread the main part of the page. There will be a big gap between the content and the right hand sidebar. Change class .with-sidebar from 590px to 790px to make the content fill the page. You can remove the width from #page and .with-sidebar to make the content fluid but the right sidebar will drop to the bottom of the page. Simple experiments with margins do not fix the problem. Slightly more complex changes run into problems with different browsers. If you find an easy solution for all browsers using only CSS changes, please add a comment. Registered users can add comments.

Example HTML

Here are example HTML elements to see how they are formatted by this theme.

<a href="?x">link 1</a>: link 1 This is a test of a link you have not visited. See how links are highlighted. Hover your mouse over this link to see any hover effects that might be used then select the link to see the link displayed as visited.

<a href="?y">link 2</a>: link 2 Leave this link unselected as a comparison link you have not visited.

<abbr title="abbreviation">abbr</abbr>: abbreviation

<acronym title="Cyclic Redundancy Checksum">CRC</acronym>: CRC

<blockquote>blockquote</blockquote>:

blockquote

<cite>cite</cite>: cite

<code>code</code>: code

<div>div</div>:

<form> and <input>: The the comments form at the end of this page (if you are logged in).

<em>em</em>: em

<h1>h1</h1> is usually the top heading in the page. Repeating h1 in this test would break heading nesting.

<h2>h2</h2>:

h2

<h3>h3</h3>:

h3

<h4>h4</h4>:

h4

<h5>h5</h5>:

h5

<h6>h6</h6>:

h6

<hr />:

<ol><li>li</li></ol>:

1. li

<p>paragraph</p>:

paragraph

<q>quote</q>: quote

<span>span</span>: span

<strong>strong</strong>: strong

<table><thead><tr><td>th1</td><td>th2</td></tr></thead>
<tbody>
<tr><td>td1</td><td>td2</td></tr>
<tr><td>td3</td><td>td4</td></tr>
</tbody>
</table>:

<ul><li>li</li></ul>:

• li