help with IE7 theme

help with IE7 theme

ved Paul Harrington -
Antal besvarelser: 7
Can anyone help me make the IE7 version of our homepage look anything like the Firefox version? It worked fine in IE6

I tried editing the theme->block_l_max_width, but it didn't make any difference

FireFox
Firefox


IE7
ie7.jpg


Gennemsnitsbedømmelse: -
I svar til Paul Harrington

Re: help with IE7 theme

ved Jez H -
There is actually a dedicated themes forum:

http://moodle.org/mod/forum/view.php?f=29

If you do not get an answer here (General Problems) try re-posting in that forum instead.
Gennemsnitsbedømmelse: -
I svar til Paul Harrington

Re: help with IE7 theme

ved Mauno Korpelainen -

Paul,

a link to your site could help - I have seen similar cases but it is much easier to give possible solutions if css of site is visible...

Gennemsnitsbedømmelse: -
I svar til Mauno Korpelainen

Re: help with IE7 theme

ved Paul Harrington -
Unfortunately it's an intranet site, so I can't provide direct links

I'll copy the css here the index page links to

Thanks for your help - sorry for posting in the wrong section!

If it helps I'm running Moodle 1.9.3 (Build: 20081015)

Paul

CSS code mentioned in index page

<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<link rel="stylesheet" type="text/css" href="http://192.168.101.10/theme/standard/styles.php" />
<link rel="stylesheet" type="text/css" href="http://192.168.101.10/theme/nmni_2/styles.php" />
<meta name="description" content="" />
<!--[if IE 7]>
<link rel="stylesheet" type="text/css" href="http://192.168.101.10/theme/standard/styles_ie7.css" />
<![endif]-->
<!--[if IE 6]>
<link rel="stylesheet" type="text/css" href="http://192.168.101.10/theme/standard/styles_ie6.css" />
<![endif]-->

I'll assume you don't need the standard styles.php or .css - so here's the nmni_2/styles.php

/**************************************
 * THEME NAME: nmni_2
 *
 * Files included in this sheet:
 *
 * nmni_2/sl.css
 * nmni_2/gradients.css
 **************************************/

/***** nmni_2/sl.css start *****/

body {
 font-size: 0.82em;
 color: #333333;
 font-family: Verdana, Arial, Helvetica, Geneva, sans-serif;
 background-color: #b7c1c3 ;
 margin: 0;
 padding: 0;
}

#outerwrap {
 background: url(assets/graphics/bg.jpg) repeat-x top #b7c1c3;
 padding-top: 23px;
}

#header-home {
 background: url(assets/graphics/headerbg.jpg) no-repeat top left #4f1794;
}

#header {
 background: url(assets/graphics/headerbg.jpg) no-repeat top left #4f1794;
}

#sldesign {
 float: right;
 padding-right: 20px;
 font-size: 0.8em;
}

#copyright {
 margin-bottom: 23px;
 padding-left: 20px;
 font-size: 0.8em;
}

.navbar {
 border: none;
}

.headermenu {
 margin: 7px 20px 0 20px;
 color: #000000;
 font-size:1.1em;
}

.headermenu a:link {
 color: #4f1794;
 font-size: 1.em;
}

.headermenu a:visited {
 color: #4f1794;
 font-size: 1.1em;
}

.headermenu a:hover {
 text-decoration: underline;
 color: #4f1794;
 font-size: 1.1em;
}

.sideblock .hide-show a {
 border: none
}

h2 {
 font-size: 1.3em;
 color:#4f1794;
}

#page {
 margin: 0 auto;
 width: 967px;
}

#contenttop {
 background: url(assets/graphics/contentbg.jpg) repeat-y top left;

}

#content {
 background-color:#ffffff;
 padding: 20px;
}

#footer {
 background-color:#ffffff;
 margin-top: 0;
 padding-top: 30px;
 padding-bottom: 15px;
 margin-bottom: 10px;
}

#textsize {
 text-align: right;
 font-size: 0.9em;
 margin-top:-3px;
 background:#ffffff;
}

.sideblock {
 font-size: 1.1em;
 border: #003f76;
}

.sideblock .header, .sideblock h2.header {

 font-size: 1.1em;
 color: #ffffff;
 padding: 4px;
}

.sideblock h2 {
 color: #ffffff;
}

.sideblock .header {
 border-color: #4a168b;
 background: url(assets/graphics/sideblock.jpg) no-repeat top left #4f1794;
 color: #ffffff;
}

.sideblock .content {
 border-color: #4a168b;
}

.generalbox {
 border:none;
}

.headingblock, h2.headingblock {
 border:none;
}

.coursebox {
 border: none;
}

.coursebox .summary {
 font-size: 1em;
}

a:link,
a:visited {
 color:#310f5b;
}

a.dimmed:link,
a.dimmed:visited {
 color:#AAAAAA;
}

a:hover {
 color:#43206e;
}

.txtlarge {
 font-size: 1.2em;
}

.txtxlarge {
 font-size: 1.4em;
}

#login-index #content {
 font-size: 1em;
}

.headingblock, h2.headingblock {
 display: none;
}

/* Begin CSS Drop Down Menu */

#bluemenu a:link {
 color: #ffffff;
}

#bluemenu a:hover {
 color: #ffffff;
}

#bluemenu a:visited {
 color: #ffffff;
}

#bluemenu .bluetabs ul a:link {
 color: #ffffff;
}

#bluemenu .bluetabs ul a:hover {
 color: #ffffff;
}

#bluemenu .bluetabs ul a:visited {
 color: #ffffff;
}

.bluetabs{
color: #ffffff;
background: url(assets/graphics/tag.jpg) no-repeat top right #4f1794;
margin-top: -1px;
}

.bluetabs ul{
padding: 6px 0 8px 20px;
margin-left: 0;
margin-top: 0;
margin-bottom: 0;
color: #ffffff;
font: bold 11px Verdana;
list-style-type: none;
text-align: left; /*set to left, center, or right to align the menu as desired*/
}

.bluetabs li{
display: inline;
margin: 0;
padding-right: 4px;
background: url(assets/graphics/navbardivide.gif) top right no-repeat;
color: #ffffff;
}

.bluetabs li a{
text-decoration: none;
padding: 3px 7px;
margin-right: 3px;
color: #ffffff;
white-space: normal;
}

.bluetabs li a:visited{
color: #ffffff;
}

.bluetabs li a:hover{
text-decoration: none;
color: #ffffff;
}

.bluetabs li.selected{
 color: #ffffff;
}

.bluetabs li.selected a{ /*selected main tab style */
color:#ffffff;
text-decoration: none;
}

.bluetabs li.selected a:hover{ /*selected main tab style */
text-decoration: none;
color: #ffffff;
}

.bluetabs li.selected a:visited{ /*selected main tab style */
text-decoration: none;
color: #ffffff;
}

/* ######### Style for Drop Down Menu ######### */

.dropmenudiv_b{
position:absolute;
top: 0;
border: 1px solid #2a035a; /*THEME CHANGE HERE*/
border-width: 0 1px;
font:normal 11px Verdana;
z-index:100;
background: url(assets/graphics/subbg.jpg) repeat-x #4f1794 top right;
width: 200px;
visibility: hidden;
text-align: left;
color: #ffffff;
}


.dropmenudiv_b a{
width: auto;
display: block;
border: 0 solid #2a035a; /*THEME CHANGE HERE*/
border-bottom-width: 1px;
padding: 2px 3px;
text-decoration: none;
color: #ffffff;
}

.dropmenudiv_b a:link {
color: #ffffff;
text-decoration: none;
}

.dropmenudiv_b a:hover {
color: #4f1794;
background: #ffffff;
text-decoration: none;
}

.dropmenudiv_b a:visited {
color: #ffffff;
text-decoration: none;
}

* html .dropmenudiv_b a{ /*IE only hack*/
width: 100%;
}

.dropmenudiv_b a:hover{ /*THEME CHANGE HERE*/
background-color: #ffffff;
color: #4f1794;
}

/* End CSS Drop Down Menu */
/***** nmni_2/sl.css end *****/

/***** nmni_2/gradients.css start *****/

/***** nmni_2/gradients.css end *****/



Gennemsnitsbedømmelse: -
I svar til Paul Harrington

Re: help with IE7 theme

ved Mauno Korpelainen -

Moodle can't zoom images in sideblocks or headers so you need to use such images that fit to given width or IE will cut part of images and FF will widen the content...

Setting sideblock max and min width http://docs.moodle.org/en/Theme_settings#Sideblock_width

does not help in all cases.

You could use css like

.sideblock img{max-width:180px;
}

in your custom theme but it would work in IE and FF could not fix the height according to changed width. Maybe it's just easier to use images that are small enough.

Gennemsnitsbedømmelse: -
I svar til Mauno Korpelainen

Re: help with IE7 theme

ved Paul Harrington -
Thanks for that, I just ended up resizing the images to 160px across, 180px still had clipping.

Can you explain why the calendar box is bigger than the HTML block containing the museum site links?
Gennemsnitsbedømmelse: -
I svar til Paul Harrington

Re: help with IE7 theme

ved Mauno Korpelainen -
(Mini)calendar block has different css tags (fonts, paddings, margins,...) but it is easy to find them from standard theme css files or use plugins like Web Developer in Firefox to show css for different parts of theme...
Gennemsnitsbedømmelse: -