I want to define 2 diffrent classes. One for a menu, and one for the main content. These will both control link, hover, and visited properties. How is this done?You mean....
<html>
<head><title>Welcome</title>
<style type="text/css">
.menu {color:blue;background-color:white;}
.menu a{color: orange;}
.menu a:visited{color: orange;}
.menu a:hover{color: orange;text-decoration: overline underline;}
.main {color:dimgray;background-color:skyblue;}
.main a{color:white;}
.main a:visited{color:white;}
.main a:hover{color:white;text-decoration: overline underline;}
</style>
</head><body>
<span align="left" class="menu">
<a href=http://www.webdeveloper.com/forum/archive/index.php/"index.html">Home</a><br>
<a href=http://www.webdeveloper.com/forum/archive/index.php/"about.html">About</a><br>
<a href=http://www.webdeveloper.com/forum/archive/index.php/"etc.html">Etc</a>
</span>
<span align="center" class="main">
<p align="justify">Hello and welcome! La la la, blah blah blah, whoo whoo whoo, hee hee hee. Please click <a href=http://www.webdeveloper.com/forum/archive/index.php/"http://yahoo.com/">here</a>. Thank you.</p>
</span></body>
</html>
You can also use tables instead of SPAN tags.Originally posted by Jona
<span align="left" class="menu">
If you are using CSS until this point, why use deprecated align attribute? Better way of doing this is
<span class="menu"> and add to your css:
.menu {...; text-align: left;}
[where ... represent original styles of .menu]
<span...><p...>...
This is incorrect. Span is an inline element and it may not contain <p> - a block level element. Use <div> instead of span. Same is true for <span class="menu"> as well
<p align="justify">
Again, you may use CSS instead. align="justify" is not understood by all browsers. If you want to justify only the text in the class "main", you may use descendent selector:
.main p {text-align: justify}
[space between .main and p in the css implies that the style (justify) is to be applied to all <p> that are descendant of---i.e. contained within---any element with class="main"]
You can also use tables instead
Why use tables when a better method exists?OK, I wasn't thinking clearly, Nekit. You're right, I should've used CSS instead of adding needless attributes. Good catch. That's not a common mistake for me. Also, I didn't even think about the span/div error. I just typed it up real quick and didn't really think...
Also, about the table thing... I was just giving a suggestion that she could use the divs inside of tables to format it better. It was just a suggestion.span/div is an important thing. You may not use span instead of div.
align is still OK if transitional doctype is used. Tables... hmmm... well... I guess we are carrying a burden of history - so I'll let that pass
- NiketI meant tables for formatting. lol. And yeah, but using Transitional DTD is usually what I use, so that's probably why I didn't think of that off of the top of my head.Again, for some browsers, using HTML 4.01 transitional with the URI sends the browser in standards mode. So make sure you do not include the URI in your DTD.HTML 4.01 transitional with the URI sends the browser in standards mode. So make sure you do not include the URI in your DTDWhy? Standards mode is what you want. It makes the rendering of your page more predictable across different browsers.Originally posted by jeffmott
Why? Standards mode is what you want.
I guess I wasn't clear. Personally, I will use standards mode (with full doctype) and use div {text-align: justify} instead of <div align="justify">
However, if one uses <div align="justify"> (I see no reason to use this, but people still do), I'd suggest using 4.01 transitional DTD without the URI.However, if one uses <div align="justify"> I'd suggest using 4.01 transitional DTD without the URI...but why? The align attribute is valid under the transitional dtd, and why include the dtd at all if not for your page to be in standards mode?
<html>
<head><title>Welcome</title>
<style type="text/css">
.menu {color:blue;background-color:white;}
.menu a{color: orange;}
.menu a:visited{color: orange;}
.menu a:hover{color: orange;text-decoration: overline underline;}
.main {color:dimgray;background-color:skyblue;}
.main a{color:white;}
.main a:visited{color:white;}
.main a:hover{color:white;text-decoration: overline underline;}
</style>
</head><body>
<span align="left" class="menu">
<a href=http://www.webdeveloper.com/forum/archive/index.php/"index.html">Home</a><br>
<a href=http://www.webdeveloper.com/forum/archive/index.php/"about.html">About</a><br>
<a href=http://www.webdeveloper.com/forum/archive/index.php/"etc.html">Etc</a>
</span>
<span align="center" class="main">
<p align="justify">Hello and welcome! La la la, blah blah blah, whoo whoo whoo, hee hee hee. Please click <a href=http://www.webdeveloper.com/forum/archive/index.php/"http://yahoo.com/">here</a>. Thank you.</p>
</span></body>
</html>
You can also use tables instead of SPAN tags.Originally posted by Jona
<span align="left" class="menu">
If you are using CSS until this point, why use deprecated align attribute? Better way of doing this is
<span class="menu"> and add to your css:
.menu {...; text-align: left;}
[where ... represent original styles of .menu]
<span...><p...>...
This is incorrect. Span is an inline element and it may not contain <p> - a block level element. Use <div> instead of span. Same is true for <span class="menu"> as well
<p align="justify">
Again, you may use CSS instead. align="justify" is not understood by all browsers. If you want to justify only the text in the class "main", you may use descendent selector:
.main p {text-align: justify}
[space between .main and p in the css implies that the style (justify) is to be applied to all <p> that are descendant of---i.e. contained within---any element with class="main"]
You can also use tables instead
Why use tables when a better method exists?OK, I wasn't thinking clearly, Nekit. You're right, I should've used CSS instead of adding needless attributes. Good catch. That's not a common mistake for me. Also, I didn't even think about the span/div error. I just typed it up real quick and didn't really think...
Also, about the table thing... I was just giving a suggestion that she could use the divs inside of tables to format it better. It was just a suggestion.span/div is an important thing. You may not use span instead of div.
align is still OK if transitional doctype is used. Tables... hmmm... well... I guess we are carrying a burden of history - so I'll let that pass
- NiketI meant tables for formatting. lol. And yeah, but using Transitional DTD is usually what I use, so that's probably why I didn't think of that off of the top of my head.Again, for some browsers, using HTML 4.01 transitional with the URI sends the browser in standards mode. So make sure you do not include the URI in your DTD.HTML 4.01 transitional with the URI sends the browser in standards mode. So make sure you do not include the URI in your DTDWhy? Standards mode is what you want. It makes the rendering of your page more predictable across different browsers.Originally posted by jeffmott
Why? Standards mode is what you want.
I guess I wasn't clear. Personally, I will use standards mode (with full doctype) and use div {text-align: justify} instead of <div align="justify">
However, if one uses <div align="justify"> (I see no reason to use this, but people still do), I'd suggest using 4.01 transitional DTD without the URI.However, if one uses <div align="justify"> I'd suggest using 4.01 transitional DTD without the URI...but why? The align attribute is valid under the transitional dtd, and why include the dtd at all if not for your page to be in standards mode?