Errors when validating CSS

cybersi
cybersi used Ask the Experts™
on
Hi All

I am getting errors when validating my css file with W3c.  I have attached a copy of my error output and css so you can see them.  

Not sure if I should just ignore them or get my web developer to fix.  Maybe if it is a easy fix I can do it?

Cheers

Si
css-vaildate.jpg
stylesv1.css
Comment
Watch Question

Do more with

Expert Office
EXPERT OFFICE® is a registered trademark of EXPERTS EXCHANGE®
Scott FellDeveloper & EE Moderator
Fellow 2018
Most Valuable Expert 2013

Commented:
It's because you can just use the border-radius now and don't need to add the vendor prefix.  It is fine as is or you can take it out.  This is not something to obsess over.

Author

Commented:
Hi Scott

Which part can I remove and will it affect the look of my page?

Cheers

Si
Most of the errors are harmless.  The first 8 errors should be ignored.  Leave that code there for maximum browser compatibility.   The last error (the parse error) is a problem.

You should totally remove this line from your CSS file:
<style type="text/css">
Should you be charging more for IT Services?

Do you wonder if your IT business is truly profitable or if you should raise your prices? Learn how to calculate your overhead burden using our free interactive tool and use it to determine the right price for your IT services. Start calculating Now!

Scott FellDeveloper & EE Moderator
Fellow 2018
Most Valuable Expert 2013
Commented:
#nav li ul {
	position: absolute;
	width: 135px;
	left: -999em;
	top: 68px;
	margin:0;
	padding:0;
	list-style-type: none;
	background-color: #0661ec;
	background-color: rgba(6,97,236,0.8) !important;
	border: 1px solid #fff;
	border-top:none;
        /* comment out these 4 lines 
	-webkit-border-bottom-right-radius: 3px;
	-webkit-border-bottom-left-radius: 3px;
	-moz-border-radius-bottomright: 3px;
	-moz-border-radius-bottomleft: 3px;
        */
	border-bottom-right-radius: 3px;
	border-bottom-left-radius: 3px;
}

Open in new window

If you remove or comment out these lines:

      -webkit-border-bottom-right-radius: 3px;
      -webkit-border-bottom-left-radius: 3px;
      -moz-border-radius-bottomright: 3px;
      -moz-border-radius-bottomleft: 3px;

then the CSS will not work on old versions of Firefox or Chrome.  I would leave those lines unchanged.

However, you should totally remove this line from your CSS file:
<style type="text/css">

Open in new window

Developer & EE Moderator
Fellow 2018
Most Valuable Expert 2013
Commented:
The border radius should work on all browsers except ie8 and lower.  I think even google stopped supporting ie8 in 11/2012.    You no longer need the vendor prefix.  Like I said, it is not worth obsessing over the error if you leave it in.

Do more with

Expert Office
Submit tech questions to Ask the Experts™ at any time to receive solutions, advice, and new ideas from leading industry professionals.

Start 7-Day Free Trial