Forum Moderators: not2easy
Some rules work just fine, others don't (IE ignores them).
Contents of the rules file:
H1 { color: darkblue; font-family: arial; font-size: 14pt; }
H2 { background: silver; color: red; font-family: arial; font-size=12; font-weight:bold; width: 120px; }
H3 { background: silver; color: blue; font-family: arial; font-size=12; font-weight:bold; width: 120px; }
H4 { background: silver; color: orange; font-family: arial; font-size=12; font-weight:bold; width: 120px; }
H5 { position: absolute; left: 82px; top: 6px; color: green; font-family: arial; font-size=12; font-weight:bold; width: 120px; }
H6 { background: darkblue; color: white; font-family: arial; font-size=12; font-weight:bold; width: 120px; }
H7 { background: red; color: white; font-family: arial; font-size=12; font-weight:bold; width: 120px; }
H7 is the one that is ignored. If I rename it or define another one with a different name, still no dice.
Here's the html:
<HTML>
<HEAD>
<TITLE>SDXCSS</TITLE>
<LINK REL=stylesheet HREF="sdxcore.css" TYPE="text/css">
</HEAD>
<BODY>
<H1>Test Page</H1>
<HR color='darkblue'>
<BR>
<IMG SRC="c:\program files\sdx\key.gif">
<H6>Resource:</H6>
<H6>Mon 07/12/2004</H6>
<H7>Tue 07/13/2004</H7>
<H6>Wed 07/14/2004</H6>
<H6>Thu 07/15/2004</H6>
<H6>Fri 07/16/2004</H6>
<H6>Unassigned</H6>
<H5><I>3.2</H5>
</BODY>
</HTML>
What's wrong here? Seems like I can add a rule or two, then after that they get ignored.
ID's are preceded by a # in the css...
#top {
color: #000;
text-align: left;
}
...and entered in the html like this...
<p id="top">
...Classes are preceeded by a . in the css...
.top {
color: #000;
text-align: left;
}
...and entered in the html like this...
<p class="top">
The header classes only go up to H6 and are, technically, only supposed to be used for indicating document headings and sub-headings (article titles, for instance, and sub-titles that logically divide up the content). If you're using the H tags to determine appearance only (as opposed to logically dicing up the content) you're better off using ALL IDs and classes.
But surely limits what we can do, does it not? Suppose I need 30 or so identifiers?
Ok, so you're telling me I can't simply make up my own identifiers (like zz1, w78, rr3)? I can only use the standard H1, H2, p, etc.?
What you're talking about are the standard HTML tags. These are a fixed list. So there are only six headers, for instance.
What you need is XHTML. This allows you to add your own tags, using a "custom doctype". However, only browsers like Opera and Mozilla will style them. (IE6 is too dumb.)
Otherwise you cannot make up your own tags. If you need a seventh header (and I have seen a site that does) it needs to be defined in XHTML. To do that is quite complex.
The easiest way, which will also work in all browsers, is to use an existing tag that will do the same job. Eg:
<html>
<head>
<style type="text/css">
#h7 {font-size:12px;}
</style>
</head>
<body>
<div id="h7">This is a seventh header.</div>
</body>
</html>