CSS for adding Rounded Corners to a SharePoint 2010 Webpart Title

Here is some CSS for making Rounded Corners on a SharePoint 2010 Webpart Title

[code]
/* repeating background for header */
.ms-WPHeader .ms-WPHeaderTd, .ms-WPHeaderTdMenu, .ms-WPHeaderTdMenu:hover,
.ms-WPHeader TD.ms-WPHeaderTdSelection
{
   background: url(‘wpart_back.jpg’) repeat-x center left;
   margin: 0;
   height: 33px;
   border-color:transparent ;
   background-color:transparent;
}

/* removes the background from the drop down arrow and the checkbox on right side of header and from the spacer cells before and after the header */
.ms-WPHeader .ms-WPHeaderTdMenu,
.ms-WPHeaderTdSelSpan
{
   background-color:transparent;
}

/* right rounded corner */
.ms-WPHeader .ms-wpTdSpace
{
 background-image:url(‘wpart_right.jpg’);
 background-position: right  center;
 background-repeat: no-repeat;
 padding-left:5px;
}

/* left rounded corner */
.ms-WPHeader .ms-wpTdSpace:first-child
{
   background: url(‘wpart_left.jpg’) no-repeat;
   background-position: left center;
   padding-top: 0px;
   padding-left: 0px;
}

/* removes the underline from under the header */
.ms-WPHeader TD
{
    border-bottom: transparent 0px none !important;
    border-right: transparent 0px none !important;
    border-top: transparent 0px none !important;
    border-left: transparent 0px none !important;
}

/*wpart title padding left*/
.ms-WPHeader TD.ms-WPHeaderTd
{
 padding-left:10px;
}

/* wpart title */
.ms-standardheader.ms-WPTitle a
{
  font-weight:normal;
  color:white;
  font-weight:bold;
}
[/code]

not sure where I found this at but have been using for a year or two.

If its yours let me know so I can give credit where credit is due.

Leave a Reply