I created a drupal website using the foundation theme. At the page level the content is put inside a container. Now I created a view and I want the header of this view (using an entity rendered entity) to be full width.

But the page layout is inside a container so the child (views template) cannot exceed it's width. How can I set the header to full width without breaking the page layout?

  • 1
    Why is this getting downvotes? It's not per se a css question. It's about page to node structure – Vincent Mar 20 '14 at 13:11
  • 3
    I haven't downvoted but I must admit this does seem like an HTML/CSS issue. The short answer would be to restructure your theme's HTML/CSS as necessary to accommodate your design. I don't think there's much Drupal core or a module could do to do that restructuring for you, unless maybe you do something drastic like moving to Panels. If you can tell us in basic HTML/CSS terms how you would make that <div> appear as full width (which is the crux of the issue), we can probably tell you how to make that happen in Drupal. – Clive Mar 20 '14 at 18:36

Create header content as a seperate block and place it in the desired region. Set block visibility as views content.

  • But it should be kept dynamic. Different headers for different views. Is that possible using your solution? – Vincent Mar 18 '14 at 6:27
  • Yes. It will be. you should set visibility of block as view page path only. – Rupesh Mar 18 '14 at 6:30
  • I guess I should use the block views visibility module? – Vincent Mar 18 '14 at 7:42

change the page layout in page.tpl.php: move the container up the DOM structure until you get 100% width, this will result in closing the parent(s) of the container, having the container, and opening the parent(s) again.

or create a new region that will be in 100% width scope, and place the block there


best thing to do is just comment/hide of most of the html/php in page.tpl and then go from there.

First way to solve issues relating to css is go in views and go through all format/field and make sure there is no extra html/css markup.

Second best thing is to get CSS formatter class module and go in manage displays of that view and set a new css class and update the .css with a wrapper.


1 - Create a sub-theme based on your current theme and make the page.tpl to full width.

2 - Install theme-key module.

3 - Create a rule to switch theme based on the view you want.

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.