Scroll container with fixed element on top

Question

For a project I have a container positioned absolutely with the initial viewport dimensions. All content will be put in this container. We don't want the viewport to 'jump' while scrolling on mobile devices, that's why we've chosen for this container solution. Unfortunately there are going to be fixed elements in the container as well, which –when on top– block wheel scroll (touch scroll appears to be working still).

I understand this is happening because fixed elements are 'attached' to the viewport, instead of to the container element and so scroll events propagate to the body (which doesn't scroll). I was wondering if there is any way to let scroll events propagate to the container without using javascript 'hacks'. Note: I've looked into pointer-events: none, but the problem is there may be clickable content in the fixed elements as well.

small update: It appears to be working on iOS (Sarari) for touch scroll, but not on Android (Chrome)

Fiddle

* {
  box-sizing: border-box;
}

body {
  background-color: #93d1ca;
  font-family: monospace;
  font-size: 18px;
  line-height: 1.8;
}

.wrapper {
  position: absolute;
  left: 0;
  top: 0;
  width: 90%;
}

.wrapper--body {
  height: 100%;
  overflow: auto;
  overflow-x: hidden;
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
  background-color: #DCF0EE;
}

.wrapper--content {
  height: 500vh;
  padding: 1em;
  background-image: linear-gradient(rgba(7, 48, 84, 0), rgba(7, 48, 84, 1));
}

.content {
  position: relative;
  width: 90%;
}

.content--fixed {
  position: fixed;
  padding: 1em;
  border: 1px dashed #073054;
}

<div class="wrapper wrapper--body">
  <div class="wrapper wrapper--content">

    <div class="content">
      <h1>
        Scrumicorns
      </h1>
      <p>
        Synergistically coordinate bleeding-edge best practices via market-driven services. Synergistically whiteboard multimedia based models with maintainable ROI. Progressively mesh adaptive strategic theme areas for plug-and-play metrics. Dynamically extend
        granular e-commerce after empowered benefits. Credibly cultivate resource sucking channels for bricks-and-clicks sources.
      </p>
    </div>

    <div class="content content--fixed">
      <h1>
        Fixed Scrumicorns
      </h1>
      <p>
        Appropriately facilitate holistic vortals whereas cross functional infrastructures. Interactively restore prospective opportunities whereas end-to-end processes. Intrinsicly procrastinate functionalized testing procedures for robust catalysts for change.
        Dynamically innovate interactive ROI and fully tested e-services. Appropriately engage market positioning benefits with principle-centered materials.
      </p>
    </div>


  </div>
</div>