在Angular中使用SCSS来定义元素相对于容器的位置，可以使用CSS的定位属性和SCSS的嵌套选择器来实现。

首先，在组件的SCSS文件中定义容器样式和元素样式：

.container {
  position: relative; // 设置容器为相对定位
  width: 300px;
  height: 200px;
  background-color: #ccc;
}

.element {
  position: absolute; // 设置元素为绝对定位
  top: 50%; // 相对于容器顶部的偏移量为50%
  left: 50%; // 相对于容器左侧的偏移量为50%
  transform: translate(-50%, -50%); // 将元素居中
  width: 100px;
  height: 100px;
  background-color: #f00;
}

然后，在组件的HTML文件中使用这些样式：

这样，元素就会相对于容器进行定位，并居中显示。

此外，如果需要元素的包裹（即元素宽度自适应容器宽度），可以使用SCSS的嵌套选择器和flexbox布局来实现：

.container {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 300px;
  height: 200px;
  background-color: #ccc;

  .element {
    width: auto; // 元素宽度自适应内容
    height: 100px;
    background-color: #f00;
  }
}

这样，元素的宽度就会根据内容自适应，并在容器中水平居中显示。