Question

我有一个简单的数字标签，左边有一个图像，右边有一些文字：

LocalDateTime current = LocalDateTime.now();
System.out.println(current);

LocalDateTime afterten = current.plus(Period.ofDays(10));
System.out.println(afterten);

// error occurred here - but with LocalDateTime is resolved!
System.out.println(afterten.plus(Duration.ofDays(3)));

figure {
  display: flex;
  margin: 0;
  padding: 0;
}

figure img {
  flex: 2 2 200px;
  align-self: flex-start;
}

figure figcaption {
  flex: 3 3 300px;
  margin: 0;
  padding: 0;
}

http://jsfiddle.net/Sempervivum/k7g36p1x/3/

不幸的是，图像不会像CSS中定义的那样增长或缩小。这是什么？我知道这可以通过另外一个容器包装图像来修复，但我不喜欢这样，并且想要理解为什么简单的方法不起作用。

Answer 1

我有一个类似的问题，我通过在flex项目中添加宽度来解决它。

在你的情况下：

  figure img {
    flex: 2 2 200px;
    width: 200px;
    align-self: flex-start;
  }

  figure figcaption {
    flex: 3 3 300px;
    width: 300px;
    margin: 0;
    padding: 0;
  }

当它是图像时，CSS flex项不会增大或缩小

1 个答案: