Hello,

I have been working on this all day with no luck. How do I style an individual block (containing a view output) in the sidebar?

I am already using Firefox Firebug but it looks like there are a couple of elements that come into play.

I have had success with styling blocks everywhere else in this theme but the sidebar is throwing me for a loop.

Thanks for your help.

CommentFileSizeAuthor
#1 block-configuration-page.jpeg60.03 KBDeepika.chavan
Support from Acquia helps fund testing for Drupal Acquia logo

Comments

Deepika.chavan’s picture

Deepika.chavan CreditAttribution: Deepika.chavan commented
FileSize
block-configuration-page.jpeg60.03 KB

Hi,
Try using 'Block Class' module - http://drupal.org/project/block_class .
1. Enable the module.
2. Add following snippet to your theme's 'block-right.tpl.php' and 'block-left.tpl.php' file :

 <?php print block_class($block); ?>

And here's what the code should look like after adding the snippet in 'block-right.tpl.php' : 

<div class="sidebox-right <?php print block_class($block); ?>">

code after adding the snippet in 'block-left.tpl.php' : 

<div class="sidebox-left <?php print block_class($block); ?>">

3. To add a class to a block, simply visit that block's configuration page at Admin > Site Building > Blocks (please see the attachment) .

Now by using this class attribute you can style an individual block in the sidebar.
e.g in my case I have added following css code for primary link block.

.primary-links-block {
  border: 1px solid red;
  margin-bottom: 10px;
}
.primary-links-block h3 {
  color: red;
}