0

I am using the panels module and the mini panels modules.

I have mini panel with two section (left and right). For my design, I want to add a picture on the left side of each section. These pictures are not supposed to come from any node or content, they are just pictures for design purpose only.

How can I do that? If you suggest CSS, I will be happy to understand how?

I am a newbie, and building my first Drupal site, so I will appreciate any help.

Thanks.

1

All your panels have a common class. Probably .panels. You need to see if your left panels also have a common class, probably .panel-left or something. You can use your browsers element-inspector to see this. It will show you something like this (simplified example) if you select your node that has panels:

<div class="panels">
  <div class="panel-left">
    content
  </div>
</div>

This gives you a clue where to set your background in CSS.

.panels .panel-left {
  background:url('path/image');
}

You need to find classes that the elements you want to style have in common, but are unique enough so that you style only those.

  • Thanks a lot!I did that, and it's working nicely. But, I am using responsive theme, and when I am re-sizing the window, the text & info of the panels are going on top of the picture, something I want to avoid. I don't want the text covering the picture. how can I prevent this from happening? – EB84 Dec 14 '13 at 10:18
  • set margins to the field inside the panel. – Marcel Dec 14 '13 at 19:09

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.