javascript - 当一个文本 div 更改时,使其他文本 div 更改大小

标签 javascript jquery html css twitter-bootstrap-3

<分区>

我有以下文本 div。

.owners{
  margin: 0px 20px 0px 20px;
}
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
  <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
<div class="row owners">
    <div class="col-sm-3 text-center" style="background-color:lavender;overflow-wrap:break-word;">Owner</div>
    <div class="col-sm-3 text-center" style="background-color:lavenderblush;overflow-wrap:break-word;">Owner</div>
    <div class="col-sm-3 text-center" style="background-color:lavender;overflow-wrap:break-word;">Owner</div>
     <div class="col-sm-3 text-center" style="background-color:lavender;overflow-wrap:break-word;">Owner</div>
  </div>

或以下链接:https://codepen.io/Lamdepzai123/pen/RJqPqq

当我编辑文本div的内容时,文本会环绕,使一个div改变它的大小。我想知道如何使其他三个 div 根据该 div 更改其大小。

如果有任何帮助,我将不胜感激。

最佳答案

添加这个CSS:

.owners{
  margin: 0px 20px 0px 20px;
  flex-wrap: wrap;
   display: flex;
   justify-content: center;
}
.text-center{
    display: flex;
  justify-content: center;
  flex-direction: column;
  text-align: center;
}

这里是 the updated codepen

关于javascript - 当一个文本 div 更改时,使其他文本 div 更改大小,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/51946361/

上一篇:html - 给背景弯 Angular

下一篇:javascript - 定位给定标签的所有最后(但不是最后)元素

相关文章:

javascript - 如何使用 Canvas 创建如下链接的动画?

JQuery Double 每个函数

javascript 累积箭头控件

javascript - 字符串到多维数组

javascript - Mongoose 的意外行为

javascript - 在表值上绑定(bind)更改事件

javascript - 根据另一个选择框设置选择框的默认文本

javascript - 一起使用滚动和调整大小处理程序

jquery - 防止使用 jquery 加载 iframe 和图像

javascript - 如何显示/隐藏生成的无序列表