div.panel-pane div.node

esolitos — Mon, 27 Jul 2015 08:27:43 +0000

Esolitos Marlon

Web Developer and Duck Slayer

Monday, 27 July, 2015 - 10:27

Today while I was working on a Drupal-based website I stumbled, as many other times, on the annoyance of panels.css that resets the margin and the padding of nodes when those are placed (anywhere) inside a panel, which as you can imagine happens quite a lot of times.
Until today I have always simply added a div.node to the css selector to override this in my themes, but not today!

Today I finally said no to the tyranny of Panels!

The solution was very easy, the only thing that kept me from solving the issue was actually just my laziness: it was simply faster* to add a more specific selector in the css.
Now the solution add this to your theme_name.info

stylesheets[all][] = css/panels.css

and then create an empty panels.css file into your theme css directory!

I know, it's easy, and i know you loose all the extremely useful 51 lines of css that are provided by the default css file that is provided with the module, but let's face it it's not like there's something very useful in there, you can take a look at it yourself if you're interested.

I hope this was useful to someone that has been struglging to get rid of this boring rule, don't be lazy like me: be smart and get rid of it as soon as you start theming!

EDIT: as a colleague of mine suggested, if you want to have a good time you can read through the comments in the Issue #232608 on Panels project d.o regarding this "non-bug".

* = This is actually not true, since you have to repeat every time you want to apply some margin/padding to a node inside a panel.

Tags:

esolitos.com - drupal

div.panel-pane div.node

Today I finally said no to the tyranny of Panels!