Posts Tagged ‘CSS’

Using WebCenter Publisher with Internet Explorer 11

Tuesday, May 26th, 2015

The release of Internet Explorer 11 has caused a unique set of issues for WebCenter Interaction. We’ve covered some WCI portal hacks and Collaboration server hacks to work around some of these challenges; today’s post is about Publisher.

First off, you’ve probably noticed that Publisher doesn’t work with IE11:
publisher-ie-5.5
The solution to this problem is simple: Go to Tools: Compatibility View Settings, and add your portal site to the list:
compatibility_list_ie11

This will enable “Compatibility Mode” for IE, which means that (among other things) the user agent string will contain “MSIE”, which lets Publisher use its antiquated user agent sniffing to enable Publisher Explorer:
publisher-explorer
The next one after the break isn’t quite so simple. (more…)

Use FireFox 3D view to diagnose CSS issues

Sunday, January 5th, 2014

It’s been a while since our last post as I’ve been busy with my other blog, homeautomationguru.com, but this little gem was too neat to pass up (thanks Aseem for the tip!).

When diagnosing complex CSS or HTML issues with multiple layers, there’s a nifty little 3D view built into FireFox that allows you to rotate around all the various layers, inspecting the elements that may be causing you problems.

Simply hit F12 to bring up the debugger pane (which, incidentally also opens the dev tools in IE and Chrome as well), then click the “3D View” button:
firefox-3d-view

Cool Tools 6: IE Web Developer 2

Thursday, June 24th, 2010

After upgrading from ALUI 6.1 to WCI 10gR3, all of our portlets looked … wrong.  The background color had reverted the blue, and they were cutting off on the right side so you couldn’t see the toolbar buttons.  Strangely, this was only happening in IE, so we weren’t able to use Firefox’s FireBug.  Fortunately, there’s a similar type of tool offered by IEInspector Software called IE Web Developer 2.

Similar to FireBug, it offers basic HTTP tracing, JavaScript debugging, and, in this case, DOM/CSS analysis.  This allows you to higlight an item on the page – in this case, a portlet – and view all the styles applied to that item.  it also shows you where the style definitions are coming from:

Using it, we were able to determine that the CSS files had changed, and there was an addition of “table-layout:fixed’ and a ‘background-color’ definition in the CSS definitions for the column layouts.  Removing these definitions from the CSS restored the look and feel back to the way we had prior to the upgrade.

How did we update the hundreds of CSS files we had?  Well, that’s a post for another day… (more…)