stylesheet: fix logo layout on Chrome

The new layout hits a bug where the logo are not laid out properly.
See https://github.com/philipwalton/flexbugs/issues/225
This commit is contained in:
Pierre de La Morinerie 2019-03-20 16:58:10 +01:00
parent c1743d63d1
commit afac5e3b16

View file

@ -50,15 +50,27 @@ $procedure-context-breakpoint: $two-columns-breakpoint;
.procedure-logos {
display: flex;
justify-content: space-around;
align-items: center;
margin-bottom: 20px;
> :not(:last-child) {
margin-right: $default-padding;
}
img {
max-height: 50px;
max-width: 100%;
margin: 0 10px 20px 10px;
max-height: 50px;
// Fix Chrome flexbox issue
// See https://github.com/philipwalton/flexbugs/issues/225
width: 100%;
height: 100%;
min-width: 0;
object-fit: contain;
@media (min-width: $procedure-context-breakpoint) {
max-height: 130px;
max-width: 500px;
max-height: 130px;
}
}
}