css - 附加侧边栏覆盖 Angular Material flex 行

Question

想法是当屏幕尺寸小于 1200px 左右时，让侧边栏保持在顶部。当屏幕尺寸大于 1200 像素时 - 应在用户向下滚动页面时固定边栏。现在贴边栏<div class="side-tool-panel" layout="column">干扰邻居容器 <div class="content-wrapper" layout="row" layout-wrap> .如何制作<div class="content-wrapper" layout="row" layout-wrap>为<div class="side-tool-panel" layout="column">自动换类补房？

codepen

Answer 1

您可以使用 layout system Angular Material 来做到这一点。试试这个:

<div ng-app="MyApp" ng-controller="AppCtrl" class="dialogdemoBasicUsage" id="popupContainer" ng-cloak="" layout="column" layout-gt-md="row" layout-wrap>
    <div class="side-tool-panel" layout="column" flex-gt-md="15"></div>
    <div class="content-wrapper" layout="row" layout-wrap flex-gt-md="85"></div>
</div>

在这段代码中，我使用 layout-gt-md，width >= 1280px。然后，我在 2 个 child div 中使用 flex-gt-md。 Here

希望这对您有所帮助。