As I work on a new webpage, I find myself stuck (yes, I'm a beginner :-) ).
I have a header followed by a section, and I would like to place images in between the two. However, despite my attempts to position the images, they keep getting hidden "under" the header, cutting off half of the picture. I have tried using z-index, but it doesn't seem to be working. My goal is to have the image split between the header and the section.
Any suggestions or tips? Here is the beginning of my code (I have omitted the html and head tags for convenience).
<div class="big_mama">
<header>
<nav class="main_nav">
<ul>
</ul>
</nav>
</header>
<section id="section">
<article class="article">
<div class="pictures">
<img src="#" />
</div>
</article>
<article class="article">
<div class="pictures">
<img src="#" />
</div>
</article>
</div>