Я пытаюсь изменить цвет текста в <p> на серый. Я думал, что что-то вроде <p class="gray">content</p> и p.gray { color: #333333; } будет работать, но ничего не делает. Цвет остается черным. Помогите пожалуйста?
ИЗМЕНИТЬ, ЧТОБЫ ВКЛЮЧИТЬ ВЕСЬ КОД
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">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<title>TITLE</title>
<link rel="stylesheet" type="text/css" href="c/main.css?90" />
</head>
<body>
<div id="wrapper">
<div id="divider">
<h1 class="logo5">NAME</h1>
<ul class="underlinemenu">
<li><a href="index.html">HOME</a></li>
<li><a href="about.html">ABOUT</a></li>
<li><a href="subscribe.html">SUBSCRIBE</a></li>
<li><a href="faq.html">FAQ</a></li>
<li><a href="contact.html">CONTACT</a></li>
<li><a href="login.html">LOGIN</a></li>
</ul>
</div> <!-- end divider -->
<div id="divider">
<div class="article">
<h2 class="header">HEADER</h2>
<div class="content">
<p class="gray">CONTENT</p>
<p>CONTENT</p>
</div>
</div>
</div> <!-- end divider -->
<div id="divider">
<div class="article">
<h2 class="header">HEADER</h2>
<div class="content">
<p>CONTENT</p>
<p>CONTENT</p>
</div>
</div>
</div> <!-- end divider -->
<div id="divider">
<div class="article">
<h2 class="header">HEADER</h2>
<div class="content">
<p>CONTENT</p>
</div>
</div>
</div> <!-- end divider -->
<div id="footer">
<p class="copyright">COPYRIGHT</p>
</div>
</div> <!-- end wrapper -->
</body>
</html>
CSS:
/*
Name: Smashing HTML5
Date: July 2009
Description: Sample layout for HTML5 and CSS3 goodness.
Version: 1.0
Author: Enrique Ramírez
Autor URI: http://enrique-ramirez.com
*/
/* Imports */
@import url("reset.css");
@import url("global-forms.css");
/***** Global *****/
/* Body */
body {
background: #FFFFFF;
color: #000305;
font-size: 87.5%; /* Base font size: 14px */
font-family: 'Trebuchet MS', Trebuchet, 'Lucida Sans Unicode', 'Lucida Grande', 'Lucida Sans', Arial, sans-serif;
line-height: 1.429;
margin: 0;
padding: 0;
text-align: left;
}
/* Headings */
h2 {font-size: 1.571em} /* 22px */
h3 {font-size: 1.429em} /* 20px */
h4 {font-size: 1.286em} /* 18px */
h5 {font-size: 1.143em} /* 16px */
h6 {font-size: 1em} /* 14px */
h2, h3, h4, h5, h6 {
font-weight: 400;
line-height: 1.1;
margin-bottom: .8em;
}
/* Anchors */
/*a {outline: 0;}
a img {border: 0px; text-decoration: none;}
a:link, a:visited {
color: #C74350;
padding: 0 1px;
text-decoration: underline;
}
a:hover, a:active {
background-color: #C74350;
color: #fff;
text-decoration: none;
text-shadow: 1px 1px 1px #333;
}*/
/* Paragraphs */
p {margin-bottom: 1.143em;}
* p:last-child {margin-bottom: 0;}
strong, b {font-weight: bold;}
em, i {font-style: italic;}
::-moz-selection {background: #F6CF74; color: #fff;}
::selection {background: #F6CF74; color: #fff;}
/* Lists */
ul {
list-style: outside disc;
margin: 1em 0 1.5em 1.5em;
}
ol {
list-style: outside decimal;
margin: 1em 0 1.5em 1.5em;
}
dl {margin: 0 0 1.5em 0;}
dt {font-weight: bold;}
dd {margin-left: 1.5em;}
/* Quotes */
blockquote {font-style: italic;}
cite {}
q {}
/* Tables */
table {margin: .5em auto 1.5em auto; width: 98%;}
/* Thead */
thead th {padding: .5em .4em; text-align: left;}
thead td {}
/* Tbody */
tbody td {padding: .5em .4em;}
tbody th {}
tbody .alt td {}
tbody .alt th {}
/* Tfoot */
tfoot th {}
tfoot td {}
/* LAYOUT */
/* ----------------------------------------- */
div#wrapper {
margin: 0 auto;
width: 936px;
}
div#divider {
border-bottom: 1px dotted #c5c5c5;
margin: 0 0 10px 0;
padding: 0 0 10px 0;
}
/*Credits: Dynamic Drive CSS Library */
/*URL: http://www.dynamicdrive.com/style/ */
.underlinemenu{
font-family: Delicious;
font-weight: bold;
width: 100%;
}
ul.underlinemenu {
padding: 6px 0 7px 0; /*6px should equal top padding of "ul li a" below, 7px should equal bottom padding + bottom border of "ul li a" below*/
margin: 0;
text-align: right; //set value to "left", "center", or "right"*/
}
ul.underlinemenu li{
display: inline;
}
ul.underlinemenu li a{
color: #FF0080;
padding: 6px 3px 4px 3px; /*top padding is 6px, bottom padding is 4px*/
margin-right: 20px; /*spacing between each menu link*/
text-decoration: none;
border-bottom: 1px dotted; /*bottom border is 3px*/
}
ul.underlinemenu li a:hover, ul.underlinemenu li a.selected{
color: #009ee8;
border-bottom-color: #009ee8;
}
p.copyright a{
color: #FF0080;
text-decoration: none;
}
p.copyright a:hover{
color: #009ee8;
}
/* embedded fonts */
@font-face {
font-family: Delicious;
src: url(fonts/Delicious-Heavy.otf)
}
.header {
font-family: Delicious;
}
.logo5 {
font-family: Delicious;
}
p.gray {
color: #333333;
}
Я знаю, что это взломанный беспорядок, извините. Я учусь.