skin a single block? Have theme but need one html block to have a different appearance, how?

skin a single block? Have theme but need one html block to have a different appearance, how?

- D Armitage の投稿
返信数: 7
I have a theme that I am nearly done tweaking, but I have one block in each course that needs to look different than the default appearance for all other blocks.

I know how to modify the appearance of "all blocks" in the css. But...

It is an html block that I add, and I need it to appear a different color than the rest of the blocks...how do I go about doing this?

Thanks much for your help in advance!
評点平均: -
D Armitage への返信

Re: skin a single block? Have theme but need one html block to have a different appearance, how?

- Patrick Malley の投稿
Do you have the Firefox Web Developer toolbar? If not, I've blogged about why you should have it, and given brief instruction on how to use it:

If you follow the instructions in my blog post and hover any element within the block that you want to style, you will notice that the block has a unique instance number.

For example, the "Moodle books" HTML block on Moodle's front page is div id="inst8886". If I were to add:

div#inst8886.block_html .content {
background: #000;
}

to a style sheet, I would make the content of only that one instance of html block black.
評点平均:Useful (1)
Patrick Malley への返信

Re: skin a single block? Have theme but need one html block to have a different appearance, how?

- D Armitage の投稿
Awesome! I use firebug, which is beautiful and helped me solve many problems but I NEVER paid attention to the instance! Thank you so much for this tip, it was exactly what I wanted to know!
評点平均: -
Patrick Malley への返信

Re: skin a single block? Have theme but need one html block to have a different appearance, how?

- chihuei lu の投稿
I am using moodle 1.9.4 and I added
#inst137 .block_html .content {
background-color: #9cb6de;
}
to my style sheet, nothing changed. sad
評点平均: -
chihuei lu への返信

Re: skin a single block? Have theme but need one html block to have a different appearance, how?

- Patrick Malley の投稿
Your syntax appears correct. What theme are you using? Are you certain that your instance number is correct?
評点平均: -
Patrick Malley への返信

Re: skin a single block? Have theme but need one html block to have a different appearance, how?

- chihuei lu の投稿
Here is my site http://sandbar.ldeo.columbia.edu/moodle/ I need to change the background color of "spotlight"
I added this code to style_layout.css, but the background didn't change.
#inst8 .block_html .content {
background-color: #9cb6de;
}
I am using foodle theme. http://moodle.org/mod/forum/discuss.php?d=116209

Thank you for your response.
評点平均: -
chihuei lu への返信

Re: skin a single block? Have theme but need one html block to have a different appearance, how?

- Patrick Malley の投稿
My apologies. Your syntax was not correct. After looking at your site, I realized that there should not be a space between the instance and .block_html.

The following should work:

#inst8.block_html .content {
background-color: #9cb6de;
}
評点平均:Useful (1)
Patrick Malley への返信

Re: skin a single block? Have theme but need one html block to have a different appearance, how?

- chihuei lu の投稿
Hi Patrick,

Thank you so much! I spent a lot time on this issue, and you solved my problem!! Thank you! Thank you!!
評点平均: -