html - 为什么<p>和样式显示:block not working?

标签 html css twitter-bootstrap

我的网站的 HTML 编码遇到问题。问题是标签

和带有 style="display:block" 的元素无论如何都显示在一行中。但每个 block 必须位于单独的行中。我使用 bootstrap 4.0.0 beta 2。

Screenshot of the problem

这是真实的例子https://codehint-web-ng.herokuapp.com/articles

最佳答案

display: flex 定义了父容器(.row),这就是 block 元素位于同一行的原因。 Flex 的默认行为是将所有元素放在同一行中 (flex-direction:row)

enter image description here

要解决此问题,您可以通过添加自己的 CSS 来更改 Flex 到列的方向,或者考虑 bootstrap 提供的内置类:https://getbootstrap.com/docs/4.4/utilities/flex/#direction

enter image description here

关于html - 为什么<p>和样式显示:block not working?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/47788315/

相关文章:

css - Glyphicon 加载时间导致抖动

javascript - AngularJS activetab - 有多个事件链接

Html, CSS 垂直对齐菜单

html - 如何将箭头添加到div?

css - 在文本输入区域内添加位置标记字形

twitter-bootstrap - 将一个 div 元素置于另一个 div 元素的中心

javascript - WordPress:将图像从一种形式传递到另一种形式

javascript - 如何将对象数组的 id 与循环中的键等同起来? Javascript

html - 在 HTML 文件输入/上传对话框中控制文件类型

javascript - 如何在没有垂直间隙的情况下 float 元素?