Itamar Tzadok

The blocks are in the left and right columns, so you can try adding to your local styles the following lines:

styleHtml+='#left-column {width:180px;}';
styleHtml+='#right-column {width:180px;}';

This, however, might not work in IE because IE has all these issues with max width and min width so some more lines may be needed for IE compatibility.

Mary, you may be able to use the same method I suggested for the block title colors to control the sides' width although if your images are wider it won't do unless you set the images' width accordingly.

Yes but only in text mode (). If you want the javascript to reside in the block you will need to disable the HTML Editor in your profile so that section editing will use only standard web forms, or else the editor will mess up your code as soon as you open the block for editing. Alternatively you can put the javascript in a js file and only refer to it from the block which will minimize the code in the block and allow you to modify the code outside the block and without disabling the Editor.

Hope that helps.

Okay then, let's add invisibility but also make the fix a little bit more flexible.

1. Create a text file and add to it the following lines:
   
   // detect edit mode
   var arTmp=document.getElementsByTagName("body");
   var theBody=arTmp[0];
   var editMode=theBody.className.search(/editing/gi);
   
   // Hide blocks when not in editing
   if (editMode==-1) {
   // style definitions block
   document.getElementById("inst------").style.display="none";
   }
   
   
2. Again, substitute ------ for the instance id number of your definitions block. The block will be visible only when the page is in editing mode.
3. Add to the file those style definitions you currently have in the block:
   
   var styleHtml;
   styleHtml+='<style>';
   styleHtml+='#inst------ h2{color:red}';
   styleHtml+='#inst------ h2{color:red}';
   styleHtml+='#inst------ h2{color:red}';
   styleHtml+='#inst------ h2{color:red}';
   styleHtml+='</style>';
   if(document.getElementById("myStyles")){
   document.getElementById("myStyles").innerHTML=styleHtml;
   }
   
   
4. And as you can see you can add as many styles as you want.
5. Save the file with suffix js (e.g. myStyles.js) and upload it to the course/site Files.
6. Now you go back to the html block and in text mode clear its content and add the following lines:
   
   <div id="myStyles"></div>
   <script src="-------------------/myStyle.js" type="text/javascript"></script>
   
   
7. Substitute ------------------- for your js file path.
8. Save and close.
9. The styles should appear as soon as the page is refreshed and the definitions block should be invisible when the page is not in editing mode.
10. For modifying the styles you don't have to open the block. You simply go to the file, edit it, make the desired changes and save. Then you may need to refresh the cache and the page for the changes to apply.

Let me know how it works.

Have you looked for 'trust submitted content' under Users->Permissions->Define Roles->Administrator->Capabilities|Course? I can see it in Moodle Demo (1.9.4) exactly where I see it in 1.9.2. If the capability is 'Not Set' then setting it to Allow should do the trick.