In my theme on Drupal 7:50 there is #banner just beneath #menu. For #banner I have made {border-bottom:5px solid blue} The problem is that sometimes #banner is empty and then the #border remains and goes up beneath #menu and that kills the layout.

Is there a way to #banner{display:none} if "banner is empty by using PHP or how to do it. All suggestions are welcome. Killing the border with JS and CSS if #banner height is below 5 ?



One way would be to set a minimum height on #banner. That way when #banner is empty of content, there will still be a space between #menu and the border. This solution does not require you to involve PHP at all.

#banner {
  min-height: 10px;
  • The problem is there will be an extra line. But simple it is. Thanks. – hassebasse Aug 10 '16 at 8:37

If there is no banner there is no reason to output the banner div. Assuming the banner is in a region by itself you can fix this in the page template (page.tpl.php) where the region is printed.


<?php if ($page['banner_region']): ?>
<div id="banner">
  <?php print render($page['banner_region']); ?>
<?php endif; ?>

A workaround would be to apply the border to the actual banner, e.g. the image. In that way the border will only show up if there is an image.


#banner img {
  border-bottom: 5px solid blue;
  • I used your workaround and put the line on the content in #banner. But there could be a reason for an other time to do it in php. #banner is a region by itself. Does your php exemple apply on that in the way that if the region is empty it will not be visible at all? – hassebasse Aug 10 '16 at 9:46
  • Yes. The if-statement makes sure the region is only printed if there is content assigned to it. – enzipher Aug 10 '16 at 17:54

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.