How to fix an element and add overflow: hidden property?

Question

css

There are two elements external and internal. It is necessary that the inner one had a property position: fixed;and the outer one, overflow: hidden;but as soon as I attach it position: fixed;to the inner one, it disappears overflow. How to save both properties?

.outer{
  display: grid;
  height: 200px;
  width: 200px;
  border: 3px dashed;
  border-color: black;
  overflow: hidden;
}
.inner{
  position: fixed;
  height: 100px;
  width: 100px;
  margin: 100px 100px 100px 100px;
  border: 3px solid;
  border-color: black;
}

Answer 1

fixed cannot have a parent, it is always itself. Try replacing it with absolute