Error message about border-radius
When I use the Firefox Web Developer Toolbar to check Atahualpa sites, and even this forum, I get this:
Warning: Unknown property 'border-radius'. Declaration dropped. Source File: http://forum.bytesforall.com/showthread.php?t=2254 Line: 390 On my main site, it also picked up "moz-opacity" and "font-smooth" as errors. The "border-radius" CSS item seems to cause the problem, but Firefox and Safari seem to render it properly. Just curious why this shows up as a problem in the validator. Here are all the errors it found. I realize some of these are part of plugins: 59 h1, h2, h3, h4, h5, h6 Property font-smooth doesn't exist in CSS level 2.1 but exists in [css3] : always 81 pre Property word-wrap doesn't exist : normal 83 pre Property overflow-y doesn't exist in CSS level 2.1 but exists in [css3] : hidden 114 div.post, ul.commentlist li, ol.commentlist li Property word-wrap doesn't exist : break-word 120 pre, .wp_syntax Property word-wrap doesn't exist : normal 146 div#container Property -moz-border-radius doesn't exist : 10px 147 div#container Property -khtml-border-radius doesn't exist : 10px 148 div#container Property -webkit-border-radius doesn't exist : 10px 149 div#container Property border-radius doesn't exist in CSS level 2.1 but exists in [css3] : 10px 224 h1.blogtitle, h2.blogtitle Property font-smooth doesn't exist in CSS level 2.1 but exists in [css3] : always 236 h1.blogtitle a:link, h1.blogtitle a:visited, h1.blogtitle a:active, h2.blogtitle a:link, h2.blogtitle a:visited, h2.blogtitle a:active Property font-smooth doesn't exist in CSS level 2.1 but exists in [css3] : always 1120 blockquote Property cont doesn't exist : italic 0.1em georgia,serif 1237 div#respond Property -moz-border-radius doesn't exist : 8px 1238 div#respond Property -khtml-border-radius doesn't exist : 8px 1239 div#respond Property -webkit-border-radius doesn't exist : 8px 1240 div#respond Property border-radius doesn't exist in CSS level 2.1 but exists in [css3] : 8px 1371 ul.children div.comment-container Property -moz-border-radius doesn't exist : 5px 1372 ul.children div.comment-container Property -khtml-border-radius doesn't exist : 5px 1373 ul.children div.comment-container Property -webkit-border-radius doesn't exist : 5px 1374 ul.children div.comment-container Property border-radius doesn't exist in CSS level 2.1 but exists in [css3] : 5px 1437 .page-numbers Property -moz-border-radius doesn't exist : 6px 1438 .page-numbers Property -khtml-border-radius doesn't exist : 6px 1439 .page-numbers Property -webkit-border-radius doesn't exist : 6px 1440 .page-numbers Property border-radius doesn't exist in CSS level 2.1 but exists in [css3] : 6px 1479 abbr em Value Error : display -moz-inline-box is not a display value : -moz-inline-box 1613 td#left ul.tw-nav-list li, td#right ul.tw-nav-list li Property -moz-border-radius doesn't exist : 5px 1614 td#left ul.tw-nav-list li, td#right ul.tw-nav-list li Property -khtml-border-radius doesn't exist : 5px 1615 td#left ul.tw-nav-list li, td#right ul.tw-nav-list li Property -webkit-border-radius doesn't exist : 5px 1616 td#left ul.tw-nav-list li, td#right ul.tw-nav-list li Property border-radius doesn't exist in CSS level 2.1 but exists in [css3] : 5px 1617 td#left ul.tw-nav-list li, td#right ul.tw-nav-list li Property -moz-border-radius-bottomright doesn't exist : 0 1618 td#left ul.tw-nav-list li, td#right ul.tw-nav-list li Property -moz-border-radius-bottomleft doesn't exist : 0 1619 td#left ul.tw-nav-list li, td#right ul.tw-nav-list li Property -webkit-border-bottom-right-radius doesn't exist : 0 1620 td#left ul.tw-nav-list li, td#right ul.tw-nav-list li Property -webkit-border-bottom-left-radius doesn't exist : 0 1621 td#left ul.tw-nav-list li, td#right ul.tw-nav-list li Property border-bottom-right-radius doesn't exist in CSS level 2.1 but exists in [css3] : 0 1622 td#left ul.tw-nav-list li, td#right ul.tw-nav-list li Property border-bottom-left-radius doesn't exist in CSS level 2.1 but exists in [css3] : 0 1679 .post img Property -moz-border-radius doesn't exist : 3px 1680 .post img Property -khtml-border-radius doesn't exist : 3px 1681 .post img Property -webkit-border-radius doesn't exist : 3px 1682 .post img Property border-radius doesn't exist in CSS level 2.1 but exists in [css3] : 3px 1749 .wp-caption Value Error : width Too many values or values are not recognized : auto 100% 1757 .wp-caption Property -moz-border-radius doesn't exist : 3px 1758 .wp-caption Property -khtml-border-radius doesn't exist : 3px 1759 .wp-caption Property -webkit-border-radius doesn't exist : 3px 1760 .wp-caption Property border-radius doesn't exist in CSS level 2.1 but exists in [css3] : 3px 1810 img.avatar Property -moz-border-radius doesn't exist : 3px 1811 img.avatar Property -khtml-border-radius doesn't exist : 3px 1812 img.avatar Property -webkit-border-radius doesn't exist : 3px 1813 img.avatar Property border-radius doesn't exist in CSS level 2.1 but exists in [css3] : 3px 1913 .sociable-hovers Property opacity doesn't exist in CSS level 2.1 but exists in [css3] : 0.4 1914 .sociable-hovers Property -moz-opacity doesn't exist : 0.4 1915 .sociable-hovers Parse Error opacity=40) 1920 .sociable-hovers:hover Property opacity doesn't exist in CSS level 2.1 but exists in [css3] : 1 1921 .sociable-hovers:hover Property -moz-opacity doesn't exist : 1 1922 .sociable-hovers:hover Parse Error opacity=100) 2094 Unknown pseudo-element or pseudo-class :empty 2098 Unknown pseudo-element or pseudo-class :empty 2102 Unknown pseudo-element or pseudo-class :empty 2106 Unknown pseudo-element or pseudo-class :empty 2784 * html a.posts-icon, a.comments-icon, a.email-icon, img.logo Property behavior doesn't exist : url("http://www.larchmontgazette.com/wp27/wp-content/themes/atahualpa344/js/iepngfix.php") 2889 .sociable-hovers Property opacity doesn't exist in CSS level 2.1 but exists in [css3] : 1 2890 .sociable-hovers Property -moz-opacity doesn't exist : 1 2891 .sociable-hovers Parse Error opacity=100) 2968 .sociable-hovers Property opacity doesn't exist in CSS level 2.1 but exists in [css3] : 0.4 2969 .sociable-hovers Property -moz-opacity doesn't exist : 0.4 2970 .sociable-hovers Parse Error opacity=40) 2973 .sociable-hovers:hover Property opacity doesn't exist in CSS level 2.1 but exists in [css3] : 1 2974 .sociable-hovers:hover Property -moz-opacity doesn't exist : 1 2975 .sociable-hovers:hover Parse Error opacity=100) 3139 .links_slideshow_control input Property -moz-border-radius doesn't exist : 4px 3140 .links_slideshow_control input Property -khtml-border-radius doesn't exist : 4px 3141 .links_slideshow_control input Property -webkit-border-radius doesn't exist : 4px 3142 .links_slideshow_control input Property border-radius doesn't exist in CSS level 2.1 but exists in [css3] : 4px 3283 .jdGallery a.gallerySelectorBtn Property opacity doesn't exist in CSS level 2.1 but exists in [css3] : 0.4 3284 .jdGallery a.gallerySelectorBtn Property -moz-opacity doesn't exist : 0.4 3285 .jdGallery a.gallerySelectorBtn Property -khtml-opacity doesn't exist : 0.4 3286 .jdGallery a.gallerySelectorBtn Parse Error opacity=40) 3443 .jdGallery a.right, .jdGallery a.left Parse Error opacity=20) 3444 .jdGallery a.right, .jdGallery a.left Property -moz-opacity doesn't exist : 0.2 3445 .jdGallery a.right, .jdGallery a.left Property -khtml-opacity doesn't exist : 0.2 3446 .jdGallery a.right, .jdGallery a.left Property opacity doesn't exist in CSS level 2.1 but exists in [css3] : 0.2 3451 * html .jdGallery a.right, * html .jdGallery a.left Parse Error opacity=50) 3456 .jdGallery a.right:hover, .jdGallery a.left:hover Parse Error opacity=80) 3457 .jdGallery a.right:hover, .jdGallery a.left:hover Property -moz-opacity doesn't exist : 0.8 3458 .jdGallery a.right:hover, .jdGallery a.left:hover Property -khtml-opacity doesn't exist : 0.8 3459 .jdGallery a.right:hover, .jdGallery a.left:hover Property opacity doesn't exist in CSS level 2.1 but exists in [css3] : 0.8 3498 .withArrows a.open Property -moz-opacity doesn't exist : 0.8 3499 .withArrows a.open Property -khtml-opacity doesn't exist : 0.8 3500 .withArrows a.open Property opacity doesn't exist in CSS level 2.1 but exists in [css3] : 0.8 3506 * html .withArrows a.open:hover Parse Error opacity=80) |
border-radius and opacity aren't part of CSS2 but the upcoming CSS3. It works fine in all browsers, and where it doesn't work (IE) it doesn't cause problems.
These W3C "errors" are there on purpose, or else the corners would have to be done with Javascript, or with images. I would use W3C as an additional tool to find errors such as tags that aren't closed but it is not the end all of web design. Testing in all major browsers is much more important. Being valid doesn't mean that it'll work in all browsers. Google, Yahoo, Amazon, Ebay, Wikipedia... 95% of the big sites are not "valid" by W3C standards. Only wordpress.org and bbc.co.uk are, and w3.org of course. This doesn't mean that I don't check for W3C validity. But in cases like this (use lightweight CSS and accept "error" message, or use bulky Javascript) I do what I consider more effective and functional |
Thanks for the explanation, Flynn. You're right; all the major sites I visited and checked did show errors too. The toolbar is a great learning method, though.
Nice to see your face! |
All times are GMT -6. The time now is 03:18 AM. |
Powered by vBulletin® Copyright ©2000 - 2024, Jelsoft Enterprises Ltd.