Question

我试图让3个左对齐的浮点数。 Here以下JFiddle就是这样做的。

＆＃13;

div { height: 45px; }
div.side {
    background-color: skyblue;
    width: 72px;
    float: left;
}
div#range {
    background-color: tomato;
    width: 216px;
    float: left;
}
span {
    width:100%;
    text-align: center;
    display: block;
    margin: 3px auto;
    /* background-color: gold; */
}

＆＃13;

<div id="start" class="side">
    <button type="button">Click Me!</button>
</div>
<div id="range"></div>
<div id="end" class="side">
    <button type="button">Click Me!</button>
</div>

＆＃13;

我现在要做的就是将div中的按钮居中对齐。我已尝试使用另一个div将文本对齐设置为居中，但这不起作用。

Answer 1

我猜他的意思是水平的，基于text-align属性。

Hav你试图在Buttons with

周围添加一个包装div

.btn-wrapper{
  position: absolute;
  left:40%;
  right:40%;

也许这对你有用

Answer 2

应用于text-align: center div的.side应该可以解决问题，因为默认情况下button元素是内联的。请注意，我更改了.side的宽度以使居中效果显着：https://jsfiddle.net/021gu79c/1/。

CSS：

div.side {
    background-color: skyblue;
    width: 120px;
    float: left;
    text-align: center;
    line-height: 45px;
}

Float中的中心对齐按钮：左侧div

2 个答案: