By Eric Harlan
Published: February 9, 2009
Updated: February 9, 2009
Print    Email

A colleague of mine out in the great state of Nebraska is working on a client site that needed a skinned web part header/title area. She kept running into an issue that when a user WAS logged in, they would get a space in between the right end cap image (the location of the drop down for editing the settings of a web part) and the main top span.  I had the same issue when using her code (for both IE and firefox). I started tinkering around and got it to the point where i had no end cap at all for users who were NOT logged in, but looked fine for folks that were. For me and the project I am on, that is an acceptable compromise.

Obviously this is not a replacement for the stacking web part method, and I'm sure there are a few other ways to skin web parts but at least with this method you might be able to cut some of the time down.  Special thanks to Erik Akers of Base70 for helping with the css.

The original post was made on ..... uh.. kyle's sharepiont karate (????) http://www.thesug.org/blogs/kyles/Lists/Posts/ViewPost.aspx?ID=9

Here is the code and below is the final result.

 

/* Web Part top image */
 
table.ms-viewtoolbar{
background-image:url('/PublishingImages/tan_bar_back.gif');
background-repeat:repeat-x;
background-color:#d6e8ff;
}
 
.ms-WPHeader td{
 border: none;
}
tr.ms-WPHeader TD
{
  background: url('/PublishingImages/bar_end_right.gif') no-repeat right top;
  overflow: visible;
  height: 24px;
}
.ms-standardheader.ms-WPTitle
{
 font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;
 font-size : 11px;
 font-weight: bold;
 color:#000099;
 background: url('/PublishingImages/tan_bar_back.gif') left top;
 background-repeat:no-repeat margin-right: 24px;
 padding: 3px 0 0 5px;
 height: 24px;
}

/* Temp Static Navigation */

.staticNavLinks
{
 color:#ffffff;
 background-image:url('/PublishingImages/bulletpointgif.gif');
 background-position:left,center;
 background-repeat:no-repeat;
 padding:3px 3px 3px 25px;
 height:10px
}

 

No end cap (use not logged in)

 

With end cap (user logged in)

Submit Article

3362 Views - View Comments (1)