CSS bootstrap 4 pull-xs-right 没有按预期工作
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/39542435/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
bootstrap 4 pull-xs-right not working as expected
提问by Greg Gum
I have this html using bootstrap 4 utilitiesto pull the buttons to the right of the screen. And it does do this.
我有这个 html 使用bootstrap 4 实用程序将按钮拉到屏幕右侧。它确实做到了这一点。
However, the buttons do not push down the content below it as expected. They end up overlayed on top of the content below.
但是,按钮不会按预期下推其下方的内容。它们最终叠加在下面的内容之上。
If I do not use pull-xs-rightthen the buttons are left aligned, but they do push the items below.
如果我不使用,pull-xs-right那么按钮会左对齐,但它们确实会推动下面的项目。
Is there some other class I need to apply?
我还需要申请其他课程吗?
<div class="pull-xs-right">
<button click.delegate="saveEdit()"
type="submit"
class="k-button k-primary">
Save
</button>
<button click.delegate="cancel()"
class="k-button">
Cancel
</button>
</div>
回答by Sam Tomashi
In Bootstrap 4 .float-{sm,md,lg,xl}-{left,right,none}classes were added for responsive floats, and replaced .pull-leftand .pull-right.
在 Bootstrap 中.float-{sm,md,lg,xl}-{left,right,none},为响应式浮动添加了4 个类,并替换了.pull-left和.pull-right.
That means:
这意味着:
.pull-rightwas replaced by .float-right
.pull-right被替换了 .float-right
.pull-leftwas replaced by .float-left
.pull-left被替换了 .float-left
.pull-xs-rightis wrong, replace .pullby .floatthe xsbetween pull and right stands for extra small which determines the size of the element. The following are the options to change the element size: {xs,sm,md,lg,xl}where xs= extra small, sm= small, md= medium, lg= large and xl= extra large
.pull-xs-right是错误的,取代.pull通过.float的xs拉动,右支架额外的小这就决定了元素的大小之间。以下是更改元素大小的选项:{xs,sm,md,lg,xl}其中xs= 特小、sm= 小、md= 中、lg= 大和xl= 特大
回答by Joshua Torres
As mentioned above float replaces pull. So .float-rightreplaces .pull-rightand .float-leftreplaces .pull-right. You can add -{sm,md,lg,xl}for different breakpoints for example .float-md-rightwill break on medium-sized screens. If you leave off the size then it will not break and will always float in the direction indicated.
如上所述,浮动取代了拉力。所以.float-right替换.pull-right和.float-left替换.pull-right. 您可以添加 -{sm,md,lg,xl}对于不同的断点,例如.float-md-right将在中型屏幕上中断。如果您不使用尺寸,则它不会破裂,并且始终会沿指示的方向浮动。

