Html 分屏设计中的按钮放置

我在玩bootstrap，我遇到了一些我正在努力寻找答案的问题

我想在屏幕右下角靠近折叠的地方放一个“登录”。下面是我的代码：

img{
位置：绝对位置；
底部：40%；
左：50%；
转化：translateX（-40%）；
z指数：2；
}
.左侧，.右侧{
高度：50vh；
宽度：100%；
}
@媒体屏幕和屏幕（最小宽度：768px）
{
.左侧，.右侧{
高度：100vh；
}
}
.左边{
背景：#20639B；
}
.右侧{
}
.家庭btn{
位置：绝对位置；
底部：40%；
左：50%；
转化：translateX（-50%）；
z指数：2；
字号：1.6em；
}

文件
迷你博客项目
登录

img{
位置：绝对位置；
底部：40%；
左：50%；
转化：translateX（-40%）；
z指数：2；
}
.左侧，.右侧{
高度：50vh；
宽度：100%；
}
@媒体屏幕和屏幕（最小宽度：768px）
{
.左侧，.右侧{
高度：100vh；
}
}
.左边{
背景：#20639B；
}
.右侧{
位置：相对位置；
}
.家庭btn{
位置：绝对位置；
底部：20px；
右：20px；
z指数：2；
字号：1.6em；
}

文件
迷你博客项目
登录

等等，是“左下”还是“右下”？你有两个部分想把按钮放在哪里？你试过使用

absolute

？什么是“右面板”？在div类rightside和“右下角”？是的，如果你渲染它，你可以看到登录putton位于下方，我想做的是将它向下推到右边，这样它就会位于屏幕的右下角，你做了什么改变？除了转换？我删除了底部：40%；左：50%；转化：translateX（-50%）；并添加底部：20px；右：20px；到。home.btn。