Some Issues:
- I would not use XHTML until Internet Explorer supports it. HTML is easier and I strongly doubt that you’re using any of XHTML’s special features (you’re not if the page works in Internet Explorer).
- I would not use inline CSS (added via the style attribute). This makes your code harder to maintain. You can still include CSS on the same page (instead of an external file) by putting it inside of one or more style elements within the head element of your document.
- All elements must be explicitly closed in XHTML. It looks like you have two open paragraph elements. If they’re closed later (in code that you didn’t provide) then you have other errors since p and div elements are not allowed inside p elements.
- Paragraph elements are used for marking up paragraphs. Please use them correctly. One word without punctuation does not constitute a paragraph.
- The br element can (and should almost always) be avoided in favor of CSS.
Anyway, I’m not sure what the complete list of content looks like or how you intend to present it, but, since you’re associating data, a definition list (
dl) or
table are probably the most appropriate elements for your content. Example:
CODE
<div class="Items">
<h2>List of Items</h2>
<dl>
<dt>Groceries</dt>
<dd>Milk</dd>
<dt>Clothing</dt>
<dd>Shirts</dd>
<dd>Sweaters</dd>
<dt>Delivery Hours</dt>
<dd>8–10</dd>
</dl>
</div>
It might actually make more sense to split that up into two lists since the last set of items don’t seem to go together with the other two sets. Additionally, you could use a (much more complicated) table, although I would avoid doing so.
To indent content, you can use the
text-indent,
margin-left, or
padding-left properties. For example:
CODE
/* Indent all of the list items to the left. */
.Items dl { padding-left: 1em; }
CODE
/* Indent only the “dd” content to the left. */
.Items dd { text-indent: 1em; }
Note that you probably want to set all browser default margins and padding to zero at the beginning of your main style sheet, if you haven’t already. Otherwise, you have to deal with inconsistent browser defaults. Example:
CODE
* { margin: 0; padding: 0; }
| 