我希望新的弹出窗口始终以固定的宽度/高度显示在页面的右下角,并在必要时与右栏重叠。
<main>
<div class="container">
<div class="row">
<div class="col s6">
<p>Lorem ipsum dolor sit amet, Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute
irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum. Lorem ipsum dolor sit amet, Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute
irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
</div>
<div class="col s6">
<button href="#" class="clickme">Click Me</button>
<div class="box">
Lorem Ipsum is simply dummy consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
</div>
</div>
</div>
</div>
</main>
<footer class="page-footer">
</footer>
CSS:
.box {
background-color: #ccc;
border-radius: 4px;
color: #333;
margin: 5px 0;
}
我在 .box
类中尝试了不同的技巧,但没有成功,非常感谢您的帮助。
最佳答案
我不确定我是否理解正确。如果你想让 .box
类出现在底部,你可以试试这个:
.box {
background-color: #ccc;
border-radius: 4px;
color: #333;
margin: 5px 0;
position: fixed;
bottom: 0;
right: 0;
width: 200px;
height: 200px;
}
关于css - 如何使用 materialize css 打开新的 div 粘贴到页面的按钮?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/42897734/