#CSS Change the style of the View Selector in lists/libraries breadcrumb

Standard

As part of a site branding exercise the breadcrumbs that is displayed when a list or library is open on a view was causing issue. When hovering the current view name its font was bigger and the CSS was not obvious to target.

not good hover:

view_notgood2

(font is larger and little down arrow is moving to the left 2 pixels)

good hover: 

view_good2

Having spent a good hour on that single issue and Googled for solution, here is my finding for later reference.

/* keep same font and position when hovering on view name  */
.ms-ltviewselectormenuheader .ms-viewselector{
 padding-bottom:0px;
 padding-left:5px;
 padding-right:3px;
 padding-top:2px;
 margin-right:0px;
}
.ms-ltviewselectormenuheader .ms-viewselectorhover A{
 border:0px !important;
 font-family: Verdana, Helvetica ;
 color: #0060ad;
 font-weight: normal;
 background-color: transparent;
 font-size: 9px;
 text-decoration: underline !important;
 background-image: none;
 padding-bottom:0px;
 padding-left:0px;
 padding-right:3px;
 padding-top:2px;
 margin-right:0px;
}
/* down arrow to select view */
.ms-ltviewselectormenuheader .ms-viewselector-arrow{
margin:0px 5px 2px 0px !important;
}

References:

Advertisements

SharePoint 2010 Branding and Customization Resources « Branding « Sharepoint « The SharePoint Muse

Standard

I short note to bookmark this article by Marcy Kellar as she regularly updates the links to anything you need to know about Sharepoint Branding and Customisation (with an S in England ;-) Resources.

SharePoint 2010 Branding and Customization Resources « Branding « Sharepoint « The SharePoint Muse.

How to apply CSS effect in “old” browsers

Standard

Rather a bookmark to myself, I found this useful link dated back in 2009 but still in use, I wanted to show some opacity filter (RGBa) on a DIV Background but my client had mainly IE7 browsers.

This tool will convert RGBA or HSLA into –ms–filter (for IE8) and –filter (IE6 & 7)

image

 

Click the image to open the RGBa & HSLa CSS Generator for Internet Explorer on KIMILI.COM

Note to self: hide "add document" and "add item" from Sharepoint site in 2 seconds

Standard

Add this to your custom site CSS :

<style type=”text/css”>
#WebPartWPQ2 .ms-addnew
{
display:none;
}
</style>

Hideme

Sharepoint 2007 Change colour of Site Actions menu

Standard

This one below I need to log somewhere as it took me a while to find this class.
I was trying to change the background colour when hover the Site Actions drop down menu in Sharepoint 2007. In fact it’s the same colour on all drop down menus, site actions, action buttons, etc..





Here is the class in CSS :

  .ms-MenuUIItemTableHover {
      background-color: #f1f1f1 !important;  /* Roll-over on sub-menus and all drop down menus*/
      border: 1px #7BA8CE solid; 
}

Thanks Heather: How to Activate the Drop Down Menu in MOSS Sites

Standard

I always thought that I ‘ve seen a MOSS site using cascading roll-over menu on the Top Navig bar, Heather explains how to activate it.

Just one thing to add: the site has to be with the Publishing Feature activated so that the “Show Pages” can be ticked.

Great tip ! (as long as you don’t fast-reast like I did as the first site REALLY needs a page to be created , even if not used)

SharePoint Tip: How to Activate the Drop Down Menu in MOSS Sites: “SharePoint Tip: How to Activate the Drop Down Menu in MOSS Sites”