Over the past year we’ve been busy doing sharepoint design and customisation for Content and Code, the UK’s leading sharepoint solutions company, and Microsoft Worldwide Partner of the Year, getting involved in master pages, themes and designs for some of their clients, and the company itself. If you need this kind of work, contact us.
Recently we’ve been heavily involved in front end work for some SharePoint 2010 public facing sites, working with the improvements in the new system for outputted html and look and feel customisation. It has been a real learning experience and over the next few weeks we’ll be sharing some of the tips and tricks we have learnt on the project(s) to try and take the vast improvement that SharePoint 2010 is over 2007, and improve on it yet further for our clients sites. First up, fixing an interface bug in the out of the box current navigation control, that, bizarrely, only affects internet explorer.
In IE, open up a SharePoint 2010 publishing site, using the standard v4 master page, that has some links in the left hand navigation. Now, try right clicking one of those links and choosing to open it in a new tab. You’ll find you can’t. The item usually found in the context menu to do this simply isn’t there.
In order to find out what is causing this and fix it we need to dive in to the CSS for the page. The standard control, when using simple rendering to output nice unordered lists for the menu, also wraps the text inside each link in a couple of additional span tags. These are handily added to allow for additional backgrounds and CSS customisations in the menu. Very helpful, but also the root of our problem. The spans are set in the standard CSS to have a display value of ‘block’, which appears to be causing IE to not understand that the thing inside them is a link, and therefore not offering the options in the context menu! This doesn’t happen in any other browser. To fix it, simply override the display style for the spans with the classes ‘additional-background’ and ‘menu-item-text’, so that it is ‘inline’ instead, and suddenly your menu options will re-appear.
A simple fix for an odd problem, probably to do with how IE handles the z-indexing, but one worth knowing. Our client that we were working with when we found this oddity, also wrote a good, detailed post on the subject, beating us to the punch, that you can read here.
