Question

新的flex。不知道为什么右边的两个div不会占据所有的高度空间。

我想在这里得到的是在左边有一个大栏目，而右栏会被两行划分

的CSS：

.card {
  display: -webkit-flex;
  display: flex;
  margin:8% auto auto auto;
  width:450px;
  height: 150px;
  min-height: 100px;
  color: black;
}

.left-tile {
  flex: 3;
  background: #02A0E5; 
}

right-tile {
  flex: 2 1 50%;
  background: #FD6800;
  display: -webkit-flex;
  display: flex;
  flex-direction: column;
}

.up-right-tile { 
 background: #D03324;
 flex: 2;
}

.low-right-tile {
  background: #FD6800;
  flex: 2;
}

HTML

.container
  .card
    .left-tile
      .card-content
        .quote-content
          ....
    .right-tile
      .up-right-tile
        .twitter-button
          ....
      .low-right-tile
        .new-quote
          ....

实际的代码笔代码为here

Answer 1

您codepen中缺少的是您需要将XImage.FromStream类声明为card容器。

像这样：

flex

<强>更新：

您的概念似乎是正确的。您的错误只是.card { position:relative; margin:8% auto auto auto; width:450px; height: 100px; display: flex; display: -webkit-flex; background-color:#fff; }没有right-tile，那么您的代码肯定会起作用。干杯！

柔性柱不会拉伸以填充色谱柱

1 个答案: