[Plone-UI] A few solutions and a few questions for bugs regarding IE / mozilla plone compatibility

[Guy Zucker]

Hi

I've spent the past day trying to eliminate IE compatibility errors from my
site (plone 3.0) http://acg.cs.tau.ac.il  . A while back I gave the site a
"rounded corners" look (using images for corners as specified on plone's
howto guide). for the portlets and calednder. It looked great on mozilla,
but I found out it looked very uneven on IE.

After writing to the list, and getting some partial answers, I began to
customize the IEFixes.css and public.css.

My only remainig problem is that the bottom corners on the news portlet
appear a few mm lower than the bottom of the portlet on IE (and perfectly
straight on mozilla). This is especially confusing since the Events portlet
is perfectly even on IE and firefox (and I don't see a reason for the
differrence between the two portlets).

I hope my solutions are useful to someone. Note one inconsistency is still a
mystery, as well as my bug stated above, and I would appreciate any help
solving them.

Here are the inconsistencies I found:

Solution to Calendar "surpassing" the top border (uneven line over the
rounded corner)
----------------------------------------------------------------------------------------------------------------------------------------
This is a strange bug. If you add the highlighted fix to public.css with a
distinct color value (not #FFFFFF = white) you notice that one part of the
calendar is colored (below week days) while if it is added to IEFixes than
you can notice the entire calendar flashes with this color before it is
mostly colored by your background color and only a line outside the top
boundary remains colored.

Solution:
Add these lines in the specified css classes in the customized IEFixes.css
file

/* added to original calender fixes, thanks to Eitan from System. Improves
Calender*/
.portletCalendar {
   width: 114%;
   margin: 1px 0 1em 0;
/* fixes added to prevent an uneven top compared to mozilla, by coloring it
white*/
   background-color: #FFFFFF;;
}

.portletCalendar dt {
   font-weight: normal;
   text-align: center;
   line-height: 1.6em;
   border-bottom: none;
   width: auto;
   margin: 0;
   /*added to remove uneven border on IE*/
   border-style: none none; none none;;

}

Solution to Portlet "surpassing" the top border (uneven line over the
rounded corner)
----------------------------------------------------------------------------------------------------------------------------------------
Solution:
Add these lines in the specified css classes in the customized IEFixes.css
file

/*added to solve errors displaying uneven top on IE */
.portletHeader,
.portlet {
   border-top: &dtml-borderWidth; &dtml-borderStyle; #FFFFFF;;
}

Fix Calendar look on IE (not my solution, but I'll post it for other users
convenience as this is a related issue)
---------------------------------------
Initially the regular plone calendar looks bad on IE.

Some additions are needed to IEFixes.css :
1. .portletCalendar dt { modify the class to look like mine as copied above}
2. .portletCalendar { modify the class to look like mine as copied above}
3. .ploneCalendar {
    border-collapse:collapse;
   /*width was auto; - changed in accordance with Eitan's css*/
    width:100%;
    height:1%;
}


Difference between news and events portlets *(not solved)*:
------------------------------------------------------------------------

.portletFooter {
    /*background-color: &dtml-evenRowBackgroundColor;;*/
    background-color: #C0E2F2;
    margin: 0;
    padding: 0.25em 1em;
    border: &dtml-borderWidth; &dtml-borderStyle; &dtml-globalBorderColor;;
     /*altered for rounded corners - removes border from around footer*/
    /*border-style:  none none; none none;;*/
    /*only top border exists - news is different than events*/
    border-style:  solid none none none; none none;;
    /*border-style: dotted &dtml-borderStyle; none &dtml-borderStyle;;*/
    text-align: right;
}

to IEFixes.css you see the top border appear in the Event portlet footers,
but not in the news footer.
Adding the same code to public.css also adds top border to the news portlet.

all the best,

Guy
-------------- next part --------------
An HTML attachment was scrubbed...
URL: <http://lists.plone.org/pipermail/plone-ui/attachments/20080908/0a8e5830/attachment-0002.html>