As already mentioned in another answer, Internet Explorer, up to and including version 8, does not provide support for any CSS3 based styling.
While Internet Explorer 9 comes with limited CSS3 support (like border-radius and box-shadow, but neither text-shadow nor background gradients) it would require to change your masterpage as mentioned in another answer.
However, changing your masterpage to include
<meta http-equiv="X-UA-Compatible" content="IE=8;IE=9" />
could lead into other issues and is AFAIK not supported by Microsoft as of yet, hence I would stick with the default
<meta http-equiv="X-UA-Compatible" content="IE=8" />
unless you have found and ironed out all those quirks (which I haven't done yet either).
So, for IE 6-9 with the SharePoint 2010 default "X-UA-Compatible" setting, you could use the following CSS3 Pie code to make your rounded corners work:
.ms-WPHeader td,
.ms-WPHeader td.ms-wpTdSpace,
.ms-WPHeader td:first-child.ms-wpTdSpace
{
position: relative;
-pie-lazy-init:true;
-pie-poll:true;
behavior: url("/_layouts/styles/pie.htc");
}
And background gradient:
.ms-WPHeader td
{
-pie-background: none transparent, linear-gradient(#0091dc, #0091dc);
}
If you, however, decided to switch your masterpage to IE=9 mode you could use SVG to create the background gradient because, as I mentioned above, the CSS3 styles for this feature are still missing from IE 9 and are part of IE 10+.
To use SVG for the background gradient, head over to http://ie.microsoft.com/testdrive/Graphics/SVGGradientBackgroundMaker/Default.html and create your CSS code for the inline SVG, which will look similar like this:
.ms-WPHeader td
{
background-image: url(yourinlineSVGgoeshere);
}
And just in case you want to add support for Internet Explorer 10+, there's some good news and some bad news ;-)
The good news, Internet Explorer 10+ does provide native support for the most-wanted CSS3 styles, including text-shadow and background gradients. The CSS3 for the IE 10+ background gradient looks like this:
.ms-WPHeader td
{
background-image: -ms-linear-gradient(center bottom, #0091dc, #0091dc); /* IE 10*/
background-image: linear-gradient(center bottom, #0091dc, #0091dc); /* IE 11+ */
}
The bad news, I do not believe Microsoft supports Internet Explorer 10+ with SharePoint 2010 using the masterpage switch
<meta http-equiv="X-UA-Compatible" content="IE=8;IE=9;IE=10,IE=11" />
or even
<meta http-equiv="X-UA-Compatible" content="IE=Edge" />
hence the chance to use all the new CSS3 features of IE 10+ with SharePoint 2010 is pretty much out of luck to us and we have to resort to SharePoint 2013.
Last but not least let me mention that I personally prefer to not rely solely on JavaScript and CSS3 based solutions for pure Website design basically because you cannot be sure that each visitor is using the latest and greatest Webbrowser. So, as a good practice I always include an image-based fallback for background gradients and rounded corners for those Webbrowsers which either do not support CSS3 or have scripting turned off (yes, it happens quite a lot on public facing Websites).
So, for example, your background gradient would look like this with an image fallback:
.ms-WPHeader td {
background: #005bac;
background-image: url('path/to/your/file.gif') no-repeat left center;
background-image: -webkit-gradient(linear, left bottom, left top, color-stop(0,#0091dc), color-stop(1, #0091dc));
background-image: -moz-linear-gradient( center bottom, #0091dc%, #0091dc%); border-bottom: none !important;
}
I found the following Websites quite useful to create background gradient images and rounded corner images on the fly http://tools.dynamicdrive.com/gradient and http://www.roundpic.com/index.php
