This is an archived snapshot of W3C's public bugzilla bug tracker, decommissioned in April 2019. Please see the home page for more details.

Bug 818 - Generic-font-family warning despite generic family
Summary: Generic-font-family warning despite generic family
Status: RESOLVED INVALID
Alias: None
Product: CSSValidator
Classification: Unclassified
Component: Other (show other bugs)
Version: CSS Validator
Hardware: All All
: P4 minor
Target Milestone: ---
Assignee: Olivier Thereaux
QA Contact: qa-dev tracking
URL:
Whiteboard:
Keywords:
Depends on:
Blocks:
 
Reported: 2004-07-04 13:11 UTC by Jasper van der Meer
Modified: 2005-02-24 23:47 UTC (History)
1 user (show)

See Also:


Attachments

Description Jasper van der Meer 2004-07-04 13:11:49 UTC
I validated my CSS with the Jigsaw CSS validator, and I got a strange error:

________________________________________________
Warnings
URI : http://amygdela.com/

* Line : 148 font-family: You are encouraged to offer a generic family as a last
alternative
________________________________________________

But line 148 in my source is nothing more then "</style>" and I've put a generic
font everywhere in my source...?

My source is below:

As you can see, my CSS is valid, and the page is XHTML1.0 Strict valid as well,
and I think this is an error in the validator, in stead of my document. 

________________________________________________

1: 		<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
  2: <html xmlns="http://www.w3.org/1999/xhtml">
  3: <head>
  4: <!--All coding is done by amygdela, except for the shoutbox, that is ©
sargant.com -->
  5: <!--Do not copy my style, create your own!-->
  6: <title>amygdela's atmosphere | forums and portfolio</title>
  7: <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
  8: <meta name="description" content="Artists and producers community, personal
portfolio." />
  9: <meta name="keywords" content="digital arts, music, design, wallpaper,
wallpapers, art, photoshop, fruity loops, dance, beats, production, artist, PHP,
scripts, download, downlaod, amygdela, free, cool, shout, resources, template,
website, psd, file, wallpaper, misc, battle, showcase, community, board, forum" />
 10: <meta name="rating" content="general" />
 11: <meta name="copyright" content="Copyright ©2003 - 2004" />
 12: <meta name="revisit-after" content="7 Days" />
 13: <meta name="expires" content="never" />
 14: <meta name="distribution" content="global" />
 15: <meta name="robots" content="index,follow" />
 16: <style type="text/css">
 17: <!--
 18: body {
 19: 	margin-left: 12%;
 20: 	margin-top: 0%;
 21: 	margin-right: 12%;
 22: 	background-color: #CDCDCD;
 23: }
 24: body,td,th {
 25: 	font-family: Verdana, Arial, Helvetica, sans-serif;
 26: 	font-size: small;
 27: 	color: #000000;
 28: }
 29: a {
 30: 	font-size: 9pt;
 31: 	color: #0685D6;
 32: }
 33: a:visited {
 34: 	color: #0685D6;
 35: }
 36: a:hover {
 37: 	color: #EDEDED;
 38: 	background-color: #0685D6;
 39: }
 40: a:active {
 41: 	color: #03446C;
 42: }
 43: h1 {
 44: 	font-size: 12pt;
 45: 	color: #000000;
 46: }
 47: h2 {
 48: 	font-size: 12pt;
 49: 	color: #0281CE;
 50: }
 51: h3 {
 52: 	font-size: 10pt;
 53: 	color: #000000;
 54: }
 55: h4 {
 56: 	font-size: 110%;
 57: 	color: #0281CE;
 58: 	letter-spacing: 0.1em;
 59: }
 60: h5 {
 61: 	font-size: 9pt;
 62: 	color: #000000;
 63: }
 64: h6 {
 65: 	font-size: 9pt;
 66: 	color: #0281CE;
 67: }
 68: td {
 69:     margin: 0px;
 70: }
 71: img {
 72:     border: 0px;
 73:     vertical-align: top;
 74: }
 75: hr {
 76: 	height: 1px;
 77: 	color: #000000;
 78: 	width: 95%;
 79: 	margin-left: 0%; 
 80: }
 81: .maintable {
 82: 	height: 540px;
 83: 	width: 740px;
 84: 	border: 0px;
 85: }
 86: .nav {
 87: 	background-color: #EDEDED;
 88: 	height: 248px;
 89: 	width: 104px;
 90: 	word-spacing: 0.1em;
 91: }
 92: .content {
 93: 	background-color: #EDEDED;
 94: 	background-image: url(images/test_20.jpg);
 95: 	height: 248px;
 96: 	width: 425px;
 97: }
 98: .shout {
 99: 	background-color: #EBEBEB;
100: 	height: 248px;
101: 	font-family: Verdana, Arial, Helvetica, sans-serif;
102: 	font-size: x-small;
103: 	font-weight: normal;
104: }
105: .navleft {
106: 	background-color: #EDEDED;
107: 	background-image: url(images/test_17.jpg);
108: 	height: 248px;
109: 	width: 19px;
110: }
111: .navright {
112: 	background-color: #EDEDED;
113: 	background-image: url(images/test_19.jpg);
114: 	height: 248px;
115: 	width: 39px;
116: }
117: .shoutright {
118: 	background-color: #EBEBEB;
119: 	background-image: url(images/test_22.jpg);
120: 	height: 248px;
121: }
122: .contentdiv {
123: 	width: 396px;
124: }
125: .copyright {
126: 	margin-left: 26%;
127: 	margin-right: 12%;
128: 	font-family: Verdana, Arial, Helvetica, sans-serif;
129: 	font-size: 8pt;
130: }
131: .historylink {
132: 	width: 200px;
133: 	height: 500px;
134: }
135: .blog {
136: 	width: 95%;
137: 	border: 0px;
138: 	font-family:Verdana, Arial, Helvetica, sans-serif;
139: 	font-size: 9pt;
140: }
141: .newspost {
142: 	background-color: #F5F5F5;
143: 	width: 390px;
144: 	font-family: Verdana, Arial, helvetica, sans serif;
145: 	font-size: 9pt;
146: }
147: -->
148: </style>
149: </head><body>
150: <table id="maintable" cellpadding="0" cellspacing="0" class="maintable">
151: 	<tr>
152: 			<td colspan="2"><img src="images/test_01.jpg" width="123" height="217"
alt="amygdela.com" /></td>
153: 			<td><img src="images/test_02.jpg" width="39" height="217"
alt="amygdela.com" /></td>
154: 			<td><img src="images/test_03.jpg" width="203" height="217"
alt="amygdela.com" /></td>
155: 			<td><img src="images/test_04.jpg" width="222" height="217"
alt="amygdela.com" /></td>
156: 			<td colspan="2"><img src="images/test_05.jpg" width="153" height="217"
alt="amygdela.com" /></td>
157: 	</tr>
158: 	<tr>
159: 			<td colspan="2"><img src="images/test_06.jpg" width="123" height="17"
alt="amygdela.com" /></td>
160: 			<td><img src="images/test_07.jpg" width="39" height="17"
alt="amygdela.com" /></td>
161: 			<td><img src="images/test_08.jpg" width="203" height="17"
alt="amygdela.com" /></td>
162: 			<td><img src="images/test_09.jpg" width="222" height="17"
alt="amygdela.com" /></td>
163: 			<td colspan="2"><img src="images/test_10.jpg" width="153" height="17"
alt="amygdela.com" /></td>
164: 	</tr>
165: 	<tr>
166: 			<td><img src="images/test_11.jpg" width="19" height="31"
alt="amygdela.com" /></td>
167: 			<td><img src="images/test_12.jpg" width="104" height="31"
alt="amygdela.com" /></td>
168: 			<td><img src="images/test_13.jpg" width="39" height="31"
alt="amygdela.com" /></td>
169: 			<td colspan="2"><img src="images/test_14.jpg" width="425" height="31"
alt="amygdela.com" /></td>
170: 			<td><a href="http://amygdela.com/new/shoutbox/index.php?act=AD"><img
src="images/test_15.jpg" width="131" height="31" alt="amygdela.com" /></a></td>
171: 			<td><img src="images/test_16.jpg" width="22" height="31"
alt="amygdela.com" /></td>
172: 	</tr>
173: 	<tr>
174: 			<td class="navleft"></td>
175: 			<td valign="top" class="nav">
176: 		<hr /><p><a href="index.php">homepage</a><br />
177:   		<a href="blog.php">news / blog</a><br />
178: 		<a href="http://forum.amygdela.com" onclick="window.open(this.href);
return false;" onkeypress="window.open(this.href); return false;">forums</a><br />
179:     	<a href="soon.php">digital arts</a><br />
180:     	<a href="soon.php">wallpapers</a><br />
181:     	<a href="soon.php">funny pics</a><br />
182:     	<a href="soon.php">my music</a><br />
183:     	<a href="soon.php">downloads</a><br />
184:     	<a href="scripts.php">scripts</a><br />
185:     	<a href="soon.php">IPB skins</a><br />
186:     	<a href="about.php">about</a><br />
187:     	<a href="soon.php">contact</a><br />
188: 	<a href="affiliates_full.php">affiliates</a><br />
189: 	<a href="randomlinks/randlink.php">random</a><br /><br />
190: 	<a href="/cms" onclick="window.open(this.href); return false;"
onkeypress="window.open(this.href); return false;">news admin</a><a
href="shoutbox/index.php?act=AD" onclick="window.open(this.href); return false;"
onkeypress="window.open(this.href); return false;"><br />
191: 	shout admin</a><br />
192: 	<a href="/webmail" onclick="window.open(this.href); return false;"
onkeypress="window.open(this.href); return false;">webmail</a></p>
193: <hr />
194: 	<p>sponsored links</p><a href="http://www.free-web-statistics.com">Web
Counters</a><br />
195: 	<a href="http://thesecondbestsite.com">2ndbestsite</a><br />
196: 	<hr /><p><a
href="http://creativecommons.org/licenses/by-nc/2.0/">Copyright!</a><br />
197:   	<a href="http://validator.w3.org/check/referer">XHTML</a><a
href="http://www.contentquality.com/mynewtester/cynthia.exe?Url1=http://www.amygdela.com/new"></a><br
/>
198:   	<a href="http://jigsaw.w3.org/css-validator/check/referer">CSS</a><br
/><a
href="http://www.contentquality.com/mynewtester/cynthia.exe?Url1=http://www.amygdela.com/new">500</a></p><br
/>
199: 	online: 4
200: </td>
201: 			<td class="navright"></td>
202: 			<td colspan="2" valign="top" class="content">
203: 			  <div id="lipsum" class="contentdiv">
204:           		<h4>Welcome to amygdela's atmosphere</h4>
205:           		<p>Welcome to aav4! It was time to refresh, so here's the new
layout! Again simple but effective, just like the old versions. Be sure to join
the <a href="http://forum.amygdela.com">forums</a>, and use the navigation on
the left to navigate through my site, you might find something of interest.</p>
206: 			    <h6>Design</h6>
207: 			    <p>All my designs are done in <a
href="http://www.adobe.com/photoshop">Adobe Photoshop</a>. I've tried Corel
Bryce as well, but that makes me wanna sleep... It's so damn slow! so I'll stick
with <a href="http://www.adobe.com/photoshop">Photoshop</a>, suits me fine! I
create digital arts, wallpapers and <a
href="http://www.amygdela.com/new/www.invisionpower.com">Invision Powerboard</a>
skins. All free for download ofcourse! Take a look around, and if you have a
question, please ask in the shoutbox or <a
href="http://forum.amygdela.com">forums</a>, thanks! </p>
208: 			    <h6>webdesign</h6>
209: 			    <p>My interest in webdesign is growing and growing. What used to be
a Frontpage generated piece of junk, has now grown out to fully interactive PHP
pages in XHTML 1.0 standards! All layout is done in Photoshop, then exported to
<a href="http://www.macromedia.com/dreamweaver">Macromedia Dreamweaver</a> to
create all classes and to position the whole layout and last but not least the
sites' code is manually ordened by me, cause Dreamweaver messes up your code
bigtime! The results are what you look at right now! Want a website just like
this? Contact me and we can discuss something. You can also ask in the <a
href="http://forum.amygdela.com">forums</a>, ofcourse! :-) </p>
210: 			    <h6>Music</h6>
211: 			    <p>Since a year or two I produce music as well. So far there hasn't
been much of real quality, but I'm developing a style and I'm still exploring my
musical interests and development skills. My music is produced in <a
href="http://www.fruityloops.com">FL-Studio 4.52</a>, with a bunch of VST
plugins like NI Pro 53, Z3ta+, Superwave P8, and some more Steinberg VST's. Take
a look at <a href="http://www.steinberg.de">Steinbergs</a>' website, their
products are damn good for a producer!</p>
212: 			    <h6>IPB skins </h6>
213: 			    <p>since I opened up the forums a while ago, I also developed an
interest in skinning Invision Power Boards. I like blue, and that's the color of
the first skin I've created! Check it out here. If you want to use my skins on
your IPB, please leave a comment in my shoutbox or on the <a
href="http://forum.amygdela.com">forums</a>, thanks! </p>
214: 			    <h6>Random links</h6>
215: 			    <p><a href="randomlinks/randlink.php">Click here for a random
link!</a> Do you want your link here? Leave a shout in the shoutbox and I'll
post it for you! </p><hr />
216: <script type="text/javascript"><!--
217: google_ad_client = "pub-7637948407333688";
218: google_ad_width = 336;
219: google_ad_height = 280;
220: google_ad_format = "336x280_as";
221: google_ad_channel ="";
222: google_color_border = "EDEDED";
223: google_color_bg = "EDEDED";
224: google_color_link = "000000";
225: google_color_url = "0685D6";
226: google_color_text = "000000";
227: //--></script>
228: <script type="text/javascript"
229:   src="http://pagead2.googlesyndication.com/pagead/show_ads.js">
230: </script>
231: 			  </div>
232: 			</td>
233: 				<td valign="top" class="shout">
234: <form action="http://www.amygdela.com/shoutbox/index.php?act=SUB"
method="post">
235:   <p>Name:
236:     <input type="text" name="name" size="16" alt="name" />
237:         Homepage:
238:         <input type="text" name="net" size="16" alt="net" />
239:         Message:
240:         <input type="text" name="message" size="16" alt="message" />
241:         <input type="hidden" name="referer" value="/index.php" />
242:         <input type="submit" value="Submit" /> 
243:   </p>
244:       <table id="noisebox">
245:   <tr><td class="nbuser0">
246: <a href="http://www.amygdela.com"><b>amygdela</b></a> 
247: <br />
248: Thnx, but if you click the new links in the navigation menu on the left,
the 'news admin' link for example, you see I fixed it already... im changing the
shoutbox tonight... thnx anyway!<br />
249: </td></tr>
250: <tr><td class="nbguest1">
251: <a href="http://www.overture.uni.cc">Overture</a>
252: <br />
253: amygdela: do you want my javascript code to open the links in the shoutbox
in a new window. like you talked about b4?<br />
254: </td></tr>
255: <tr><td class="nbguest0">
256: <a href="http://www.myhell.tk">Micro</a>
257: <br />
258: You are up on my site, your turn now! :)<br />
259: </td></tr>
260: <tr><td class="nbguest1">
261: <a href="http://www.neodesigns.serverme.com">Neo</a>
262: <br />
263: Amy...my forum didnt like ur other email so i changed it to ur hotmail one,
and reactivated you.<br />
264: </td></tr>
265: <tr><td class="nbguest0">
266: <a href="http://www.myhell.tk">Micro</a>
267: <br />
268: I like your site too, i like the lay out! let me know if you want to
affiliate!!<br />
269: </td></tr>
270: <tr><td class="nbuser1">
271: <a href="http://www.amygdela.com"><b>amygdela</b></a> 
272: <br />
273: ofcourse not :-) I've just logged in and updated my personal shite...
waiting for confirmation email..<br />
274: </td></tr>
275: <tr><td class="nbguest0">
276: <a href="http://www.neodesigns.serverme.com">Neo</a>
277: <br />
278: HAHAHAHA nice front amy..... pity bout the forums, dont forget Neo Designs
now :P<br />
279: </td></tr>
280: <tr><td class="nbuser1">
281: <a href="http://www.amygdela.com"><b>amygdela</b></a> 
282: <br />
283: if yuou decide to use targets in your link, you can still validate your
page as XHTML Transitional in stead of strict... but when I found out how to do
it, I'll let you know!<br />
284: </td></tr>
285: <tr><td class="nbguest0">
286: <a href="http://www.overture.uni.cc">Overture</a>
287: <br />
288: ahhhh. i did not know that doing that was not XHTML Strict, i will have to
try another way myself then when i get my new layout up. interesting<br />
289: </td></tr>
290: <tr><td class="nbguest1">
291: <a href="http://thirty-two.net">Chris</a>
292: <br />
293: Hey, amy we should aff, link me<br />
294: </td></tr>
295: 
296: </table></form>
297: <p><a href="http://www.amygdela.com/shoutbox/index.php?act=HIS">history</a>
| <a
href="http://www.amygdela.com/shoutbox/index.php?act=AD">admin</a></p> </td>		
<td class="shoutright"></td>
298: 	</tr>
299: 	<tr>
300: 			<td colspan="2"><img src="images/test_23.jpg" width="123" height="27"
alt="amygdela.com" /></td>
301: 			<td><img src="images/test_24.jpg" width="39" height="27"
alt="amygdela.com" /></td>
302: 			<td><img src="images/test_25.jpg" width="203" height="27"
alt="amygdela.com" /></td>
303: 			<td><img src="images/test_26.jpg" width="222" height="27"
alt="amygdela.com" /></td>
304: 			<td><img src="images/test_27.jpg" width="131" height="27"
alt="amygdela.com" /></td>
305: 			<td><img src="images/test_28.jpg" width="22" height="27"
alt="amygdela.com" /></td>
306: 	</tr>
307: </table>
308: 				<p class="copyright">All content and design &copy; 2004 amygdela.com</p>
309: </body>
310: </html>
________________________________________________

Thnx in advance for your reply.

With best regards,

Jasper 'amygdela' van der Meer
Comment 1 Ville Skyttä 2004-07-04 16:44:10 UTC
Line 144 has "sans serif", should probably be "sans-serif".
Comment 2 gohankid7_7 2004-07-08 16:34:40 UTC
I offered a generic font-family, but still got the error "font-family: You are 
encouraged to offer a generic family as a last alternative". I am using an 
external style sheet. Could this be the problem? Please help! Here is my 
cool.css file:

    body , p , h1 , h2 , h3 , table , td , th , ul , ol , textarea , input
    {
    font-family : verdana, helvetica, arial, sans-serif;
    }

    @font-face
    {
    font-family: uni;
    src: url(unicode.eot);
    }

    .abra
    {
    font-family: uni;
    }

    @font-face
    {
    font-family: test;
    src: url(test.eot);
    }

    .kadabra
    {
    font-family: test;
    }

    table
    {
    margin: 0px;
    padding: 0px;
    }
Comment 3 Bj 2004-07-08 20:38:02 UTC
Where exactly do you specify the generic font family in

  font-family: uni;
  ...
  font-family: test;

?
Comment 4 Etan Wexler 2004-10-02 21:41:33 UTC
Why is this bug still open? Closing as "INVALID". Other changes include marking
component as "Other", marking platform and OS as "All", and removing the URL
whose document has been fixed.
Comment 5 bugzilla 2005-01-03 02:15:52 UTC
Line : 2 font-family: You are encouraged to offer a generic family as a last 
alternative 
Valid CSS information
.a { 
 font : small san-serif; 
} 
Comment 6 Olivier Thereaux 2005-01-03 02:22:30 UTC
(In reply to comment #5)
>  font : small san-serif; 

It's "sans-serif". Blame the French.
Comment 7 Allan 2005-02-24 23:47:25 UTC
You need to first list the family names, then the generic name.
An example from http://www.w3.org/Style/css2-updates/WD-CSS21-20030128-20020802-
diff/fonts.html

font-family: Gill, Helvetica, sans-serif;

In the above example, Gill and Helvetica are family names, and sans-serif is 
the generic family. I validated an external style sheet with no errors or 
warnings.