Мобильная версияЦентр загрузки div на прокручиваемом контенте ⇐ CSS
-
Anonymous
Центр загрузки div на прокручиваемом контенте
Is it possible to center (middle of the screen) the container of loading svg and text within a scrollable content? The content is sometimes is not scrollable. I manage to center it vertically but if the content is too long its not centered.
HTML
Loading... CSS/SCSS
.content { /* 72px - height of top navigation bar */ min-height: calc(100vh - 72px); padding-bottom: 80px; } .wrapper { padding-top: 32px; padding-bottom: 32px; width: 100%; height: 100%; } .table-overlay { position: absolute; inset: 0; z-index: 1000; width: 100%; height: 100%; .table-overlay-container { display: flex; align-items: center; justify-content: center; flex-direction: column; height: 100%; // margin-right: 20px; background-color: rgba(255, 255, 255, 0.6); } & span { user-select: none; } }
Источник: https://stackoverflow.com/questions/781 ... le-content
Is it possible to center (middle of the screen) the container of loading svg and text within a scrollable content? The content is sometimes is not scrollable. I manage to center it vertically but if the content is too long its not centered.
HTML
Loading... CSS/SCSS
.content { /* 72px - height of top navigation bar */ min-height: calc(100vh - 72px); padding-bottom: 80px; } .wrapper { padding-top: 32px; padding-bottom: 32px; width: 100%; height: 100%; } .table-overlay { position: absolute; inset: 0; z-index: 1000; width: 100%; height: 100%; .table-overlay-container { display: flex; align-items: center; justify-content: center; flex-direction: column; height: 100%; // margin-right: 20px; background-color: rgba(255, 255, 255, 0.6); } & span { user-select: none; } }
Источник: https://stackoverflow.com/questions/781 ... le-content
