정다정
10-11
241011 정다정 알림팝업 z-index 최상위
@a633f70f5515793b5364b34a660eb348349f8df9
--- client/views/pages/main/Main.vue
+++ client/views/pages/main/Main.vue
... | ... | @@ -1,8 +1,9 @@ |
| 1 | 1 |
<template> |
| 2 | 2 |
<div> |
| 3 |
- <Header></Header> |
|
| 4 |
- <div style="padding: 40px 60px 90px"> |
|
| 5 |
- |
|
| 3 |
+ <div class="header-box"> |
|
| 4 |
+ <Header></Header> |
|
| 5 |
+ </div> |
|
| 6 |
+ <div class="main-box"> |
|
| 6 | 7 |
<div class="flex justify-between"> |
| 7 | 8 |
<Side></Side> |
| 8 | 9 |
<div> |
... | ... | @@ -17,7 +18,6 @@ |
| 17 | 18 |
</div> |
| 18 | 19 |
</div> |
| 19 | 20 |
</div> |
| 20 |
- |
|
| 21 | 21 |
</div> |
| 22 | 22 |
</div> |
| 23 | 23 |
</template> |
... | ... | @@ -45,3 +45,16 @@ |
| 45 | 45 |
}, |
| 46 | 46 |
}; |
| 47 | 47 |
</script> |
| 48 |
+<style scoped> |
|
| 49 |
+.header-box {
|
|
| 50 |
+ position: relative; |
|
| 51 |
+ z-index: 200; |
|
| 52 |
+} |
|
| 53 |
+ |
|
| 54 |
+.main-box {
|
|
| 55 |
+ position: relative; |
|
| 56 |
+ z-index: 100; |
|
| 57 |
+ padding: 0px 60px; |
|
| 58 |
+ margin-top: -80px; |
|
| 59 |
+} |
|
| 60 |
+</style> |
Add a comment
Delete comment
Once you delete this comment, you won't be able to recover it. Are you sure you want to delete this comment?