当前位置: 首页 > 面试题库 >

为什么vertical-align:middle在我的span或div上不起作用?

汪辰阳
2023-03-14
问题内容

我正在尝试将一个spandiv元素垂直居中放置在另一个div元素中。但是当我放进去时vertical-align: middle,什么也没发生。我尝试更改display两个元素的属性,但似乎没有任何效果。

这是我当前在网页中执行的操作:

.main {

  height: 72px;

  vertical-align: middle;

  border: 1px solid black;

  padding: 2px;

}



.inner {

  vertical-align: middle;

  border: 1px solid red;

}



.second {

  border: 1px solid blue;

}


<div class="main">

  <div class="inner">

    This box should be centered in the larger box

    <div class="second">Another box in here</div>

  </div>

</div>

问题答案:

锁定了 160天。目前,此答案的内容已解决存在争议。它当前不接受新的交互。

这似乎是最好的方法-自我的原始文章以来已经过去了一段时间,现在应该这样做:

/* CSS file */

.main {
    display: table;
}

.inner {
    border: 1px solid #000000;
    display: table-cell;
    vertical-align: middle;
}

/* HTML File */
<div class="main">
    <div class="inner"> This </div>
</div>


 类似资料:
  • 问题内容: 我正在尝试将一个或元素垂直居中放置在另一个元素中。但是当我放进去时,什么也没发生。我尝试更改两个元素的属性,但似乎没有任何效果。 这是我目前在网页中执行的操作: 问题答案: 这似乎是最好的方法-自我的原始文章以来已经过去了一段时间,现在应该这样做:

  • 问题内容: 我有两个div,高度为90%,但显示方式有所不同。 我试图在它们周围放一个外部div,但这没有帮助。另外,在Firefox,Chrome,Opera和Safari上也是如此。 有人可以解释为什么我遇到这个问题吗? 下面是我的代码: 问题答案: 使用(视口高度)代替百分比。它将获取浏览器的高度并相应地调整其大小,例如 试试这个代码 与CSS

  • 问题内容: 我有两个div,高度为90%,但显示方式有所不同。 我试图在它们周围放一个外部div,但这没有帮助。此外,在Firefox,Chrome,Opera和Safari上也是如此。 有人可以解释为什么我遇到这个问题吗? 下面是我的代码: 问题答案: 使用(视口高度)代替百分比。它将获取浏览器的高度并相应地调整其大小,例如 试试这个代码 与CSS

  • Stage.close()对我不起作用。 我查看了:JavaFX2.0:关闭一个舞台(窗口) 这是我的代码: 下面是调用消息框类的代码:

  • 我正在尝试检测我的两个精灵何时发生碰撞。我做的第一件事是在我的播放器周围创建一个矩形(称为player.img),然后在我想检测的树周围创建另一个矩形(称为背景.treesrect)。我将玩家矩形的坐标设置为等于当用户按下键移动时更新的坐标,但玩家矩形不移动。然后我使用精灵.碰撞(精灵)函数来检测它们是否碰撞并且没有检测到。有人可以向我展示为什么我的播放器矩形没有更新以及其他任何可能错误的内容吗?

  • 问题内容: 我在这里有点困惑。如果我将变量传递给json_decode,它将不起作用: 第一个回显正确显示了我传递的JSON字符串,例如 第二个回显显示NULL。因此,我从第一个回显中获取了字符串,并编写了以下代码: 你怎么说,它向我展示了正确解码的数组。字符串绝对相同,我什至保留转义字符。也许是问题所在? 问题答案: 看起来您的服务器已启用。无论是将其禁用或运行通过使用它之前。