header_required not appearing properly on webpage

Permalink
Hi,

I am new to concrete5 and I am trying to apply an external theme into my newly installed c5. I have followed the tutorials, however my c5 edit header is not appearing properly as seen in my screenshot. I am suspecting this header is clashing with the CSS file of this external theme.

Here's an extract of my php file;

<html>
   <head>
      <!--[if lte IE 8]><script src="<?php echo $view->getThemePath(); ?>/assets/js/ie/html5shiv.js"></script><![endif]-->
      <link rel="stylesheet" href="<?php echo $view->getThemePath(); ?>/assets/css/main.css" />
      <!--[if lte IE 9]><link rel="stylesheet" href="<?php echo $view->getThemePath(); ?>/assets/css/ie9.css" /><![endif]-->
      <!--[if lte IE 8]><link rel="stylesheet" href="<?php echo $view->getThemePath(); ?>/assets/css/ie8.css" /><![endif]-->
      <?php Loader::element('header_required') ?>
   </head>
   <body>
      <div class="<?php echo $c->getPageWrapperClass(); ?>">
      <!-- Sidebar -->
         <section id="sidebar">
            <div class="inner">
               <nav>
                  <ul>


CSS extract

/* Wrapper (main) */
   #sidebar + #wrapper {
      margin-left: 18em;
   }
      @media screen and (max-width: 1280px) {
         #sidebar + #wrapper {
            margin-left: 0;
            padding-top: 3.5em;
         }
      }
      @media screen and (max-width: 736px) {
         #sidebar + #wrapper {
            padding-top: 0;
         }
      }


Thanks for reading! Please help :)

1 Attachment

 
ramonleenders replied on at Permalink Reply
ramonleenders
If you take a look at the toolbar, it's set at a specific z-index:

z-index: 1000;

You have your sidebar (#sidebar) set way higher, so it will always be ON TOP of the toolbar. So you'd have to apply a z-index that is lower than the number above. Not sure if it collides with other stuff you've developed in your theme though, but you can try this:

#sidebar {
      z-index: 999;
}


If that gives problems with other stuff, try this one (and never the change above)

#ccm-toolbar {
      z-index: 10001;
}