Warning: file_get_contents(/data/phpspider/zhask/data//catemap/7/css/36.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181
Css 如何在html中对齐一行中的多个按钮?_Css_Html_Button_Tags - Fatal编程技术网

Css 如何在html中对齐一行中的多个按钮?

Css 如何在html中对齐一行中的多个按钮?,css,html,button,tags,Css,Html,Button,Tags,我正在将两个按钮对齐到表格表格正下方的行中间 但是现在按钮的排列是垂直的。如何使它们水平并居中 我想把它们正确地对齐到行的中间,按钮应该在同一个轴上。返回登录不应在多行中 这是我试过的 div.blueButton{/*蓝色按钮,大小适合提交*/ 位置:相对位置; 保证金:0; 背景:透明url('../images/btn_blue_back.gif')repeat-x; 颜色:白色; 填充:0 4px 6px 4px; 文本对齐:居中; 宽度:45px; 左边距:520像素; } 左蓝

我正在将两个按钮对齐到表格表格正下方的行中间

但是现在按钮的排列是垂直的。如何使它们水平并居中

我想把它们正确地对齐到行的中间,按钮应该在同一个轴上。返回登录不应在多行中

这是我试过的

div.blueButton{/*蓝色按钮,大小适合提交*/
位置:相对位置;
保证金:0;
背景:透明url('../images/btn_blue_back.gif')repeat-x;
颜色:白色;
填充:0 4px 6px 4px;
文本对齐:居中;
宽度:45px;
左边距:520像素;
}
左蓝钮分区{
背景:透明url('../images/btn_blue_l.gif')没有重复;
宽度:7px;高度:22px;
位置:绝对位置;
顶部:-2px;左侧:-2px;
}
右边的蓝钮扣{
背景:透明url('../images/btn_blue\u r.gif')无重复右键;
宽度:7px;高度:22px;
位置:绝对位置;
顶部:-2px;右侧:-3px;
}
a、 按钮,。按钮{
宽度:自动;
填充:0;边距:0;
背景#005499;
字体大小:11px;字体大小:粗体;颜色:白色;文字装饰:无;
光标:指针;
}

您可以使用引导并使用类表单内联获取div 并将两个按钮都放在div中。
将div放入要显示的td中

您可以使用bootstrap并使用类表单inline获取div 并将两个按钮都放在div中。 将div放入要显示的td中

希望,这可能会有所帮助 我在两个按钮上方都使用了包装器,并提供了
display:flex
对齐内容:居中
并删除了
分区蓝按钮的固定宽度
边距

结帐

更新-添加供应商前缀

.wrap{
-webkit显示:flex;
-ms显示:flex;
-o型显示器:flex;
显示器:flex;
-webkit内容:中心;
-ms内容:中心;
-o-content:中心;
证明内容:中心;
}
蓝钮扣{
/*蓝色按钮,大小适合提交*/
位置:相对位置;
保证金:0;
背景:透明url('../images/btn_blue_back.gif')repeat-x;
颜色:白色;
填充:0 4px 6px 4px;
文本对齐:居中;
}
左蓝钮分区{
背景:透明url('../images/btn_blue_l.gif')没有重复;
宽度:7px;
高度:22px;
位置:绝对位置;
顶部:-2px;
左:-2px;
}
右边的蓝钮扣{
背景:透明url('../images/btn_blue\u r.gif')无重复右键;
宽度:7px;
高度:22px;
位置:绝对位置;
顶部:-2px;
右:-3px;
}
a、 按钮,
.按钮{
宽度:自动;
填充:0;
保证金:0;
背景#005499;
字体大小:11px;
字体大小:粗体;
颜色:白色;
文字装饰:无;
光标:指针;
}

希望,这可能会有所帮助 我在两个按钮上方都使用了包装器,并提供了
display:flex
对齐内容:居中
并删除了
分区蓝按钮的固定宽度
边距

结帐

更新-添加供应商前缀

.wrap{
-webkit显示:flex;
-ms显示:flex;
-o型显示器:flex;
显示器:flex;
-webkit内容:中心;
-ms内容:中心;
-o-content:中心;
证明内容:中心;
}
蓝钮扣{
/*蓝色按钮,大小适合提交*/
位置:相对位置;
保证金:0;
背景:透明url('../images/btn_blue_back.gif')repeat-x;
颜色:白色;
填充:0 4px 6px 4px;
文本对齐:居中;
}
左蓝钮分区{
背景:透明url('../images/btn_blue_l.gif')没有重复;
宽度:7px;
高度:22px;
位置:绝对位置;
顶部:-2px;
左:-2px;
}
右边的蓝钮扣{
背景:透明url('../images/btn_blue\u r.gif')无重复右键;
宽度:7px;
高度:22px;
位置:绝对位置;
顶部:-2px;
右:-3px;
}
a、 按钮,
.按钮{
宽度:自动;
填充:0;
保证金:0;
背景#005499;
字体大小:11px;
字体大小:粗体;
颜色:白色;
文字装饰:无;
光标:指针;
}


我们实际上正在使用很久以前开发的旧框架。有什么方法可以使用纯html和css实现这一点吗?我们实际上使用的是很久以前开发的旧framewroks。有什么方法可以使用纯html和css实现这一点吗?它在Chrome和Firefox中的工作与预期一样。但在IE中,按钮仍然垂直对齐。请检查我添加的更新代码
-webkit-
-ms-
-o-
。这些是供应商前缀指定的供应商前缀。但在IE-11.0.9600.19230中不起作用。它仍在垂直对齐项目。是否有任何设置可供我检查以更正显示?看到它应该做的工作,请分享一些你得到的图片。同时添加
对齐项目:居中
使它们垂直对齐。添加了用于参考的屏幕截图。它在Chrome和Firefox中的工作与预期一致。但在IE中,按钮仍然垂直对齐。请检查我添加的更新代码
-webkit-
-ms-
-o-
。这些是供应商前缀指定的供应商前缀。但在IE-11.0.9600.19230中不起作用。它仍在垂直对齐项目。是否有任何设置可供我检查以更正显示?看到它应该做的工作,请分享一些你得到的图片。同时添加
对齐它