[Building Sakai] Adding background-image to portal pages

Wed Oct 9 07:47:00 PDT 2013

Hi:

I was able to create a custom gateway page for our Sakai site (CLE 2.9) but I was having issues with IE 8 and IE 9 using a gradient background and a background-image

My CSS is below.

I needed to add this to the new page right under the HTML tag, but I don't know what to do to enable carrying forward the background image to the rest of the site pages in IE 8 and IE 9 (it works fine in Firefox, of course):
<!--[if IE 8 ]> <html lang="en" dir="ltr" class="ie8 ie"> <![endif]-->
<!--[if IE 9 ]> <html lang="en" dir="ltr" class="ie9"> <![endif]-->

Can anyone help me with this please?   Thank you!

The CSS:

#portalOuterContainer{
background: rgb(109,0,25); /* Old browsers */
background-image: url("images/Shield-Screen15.png"); /* fallback */
/* IE9 SVG, needs conditional override of 'filter' to 'none' */
background-image: url("images/Shield-Screen15.png"), url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iIzZkMDAxOSIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjQ0JSIgc3RvcC1jb2xvcj0iIzhmMDIyMiIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjgxJSIgc3RvcC1jb2xvcj0iI2ZjZmNmYyIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgPC9saW5lYXJHcmFkaWVudD4KICA8cmVjdCB4PSIwIiB5PSIwIiB3aWR0aD0iMSIgaGVpZ2h0PSIxIiBmaWxsPSJ1cmwoI2dyYWQtdWNnZy1nZW5lcmF0ZWQpIiAvPgo8L3N2Zz4=);
background-image: url("images/Shield-Screen15.png"), -moz-linear-gradient(top, #730027 0%, #FFFFFF 80%);  /* FF3.6+ */
background-image: url("images/Shield-Screen15.png"), -webkit-gradient(linear, left top, left bottom, color-stop(0%,#730027), color-stop(80%,#FFFFFF));   /* Chrome,Safari4+ */
background-image: url("images/Shield-Screen15.png"), -webkit-linear-gradient(top, #730027 0%,#FFFFFF 80%);  /* Chrome10+,Safari5.1+ */
background-image: url("images/Shield-Screen15.png"), -o-linear-gradient(top, #730027 0%,#FFFFFF 80%);  /* Opera 11.10+ */
background-image: url("images/Shield-Screen15.png"), -ms-linear-gradient(top, #730027 0%,#FFFFFF 80%);  /* IE10+ */
background-image: url("images/Shield-Screen15.png"), linear-gradient(top, #730027 0%,#FFFFFF 80%);  /* W3C */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#6d0019', endColorstr='#fcfcfc',GradientType=0 ); /* IE6-8 */
background-repeat: no-repeat;
background-position: 110% -45%;
}

.ie8, .ie9  #portalContainer{
                background-image: url("images/Shield-Screen15.png");
                background-repeat: no-repeat;
                background-position: 110% -45%;
}

I tried adding the .ie8, .ie9 to the portalOuterContainer but it is conflicting with the gradient.

Kim Wilson, MSCIS | Systems Analyst - IS Academic Systems | Albany Medical Center | 518-264-1055
Walk to End Alzheimer's<http://act.alz.org/site/TR/Walk/NY-NortheasternNewYork?px=8229568&pg=personal&fr_id=3580> [Walk-to-End-Alzheimers-Logo_sm]

-----------------------------------------
CONFIDENTIALITY NOTICE: This email and any attachments may contain confidential information that is protected by law and is for the sole use of the individuals or entities to which it is addressed. If you are not the intended recipient, please notify the sender by replying to this email and destroying all copies of the communication and attachments. Further use, disclosure, copying, distribution of, or reliance upon the contents of this email and attachments is strictly prohibited. To contact Albany Medical Center, or for a copy of our privacy practices, please visit us on the Internet at www.amc.edu.
-------------- next part --------------
An HTML attachment was scrubbed...
URL: http://collab.sakaiproject.org/pipermail/sakai-dev/attachments/20131009/b6b785ee/attachment.html 
-------------- next part --------------
A non-text attachment was scrubbed...
Name: image003.jpg
Type: image/jpeg
Size: 982 bytes
Desc: image003.jpg
Url : http://collab.sakaiproject.org/pipermail/sakai-dev/attachments/20131009/b6b785ee/attachment.jpg 