javascript - titulo - modificar el title con jquery
Los elementos flexibles no se reducen cuando la ventana se hace más pequeña (1)
Una configuración inicial en los elementos flexibles es min-width: auto . Esto significa que un elemento flexible no puede, por defecto, ser más pequeño que su contenido.
Puede anular esta configuración con min-width: 0 o overflow con cualquier valor que no sea visible . Agrega esto a tu código:
.plot-col {
min-width: 0;
}
Más información: ¿Por qué el elemento flexible no se encoge más allá del tamaño del contenido?
Esta pregunta ya tiene una respuesta aquí:
Estoy tratando de encajar dos parcelas gráficas una al lado de la otra dentro de un flexbox CSS. Quiero que cambien de tamaño cuando la ventana cambie de tamaño. Funciona como se esperaba cuando la ventana crece, pero los gráficos no se reducen cuando la ventana se hace más pequeña.
var trace1 = {};
var trace2 = {};
var plotdiv1 = document.getElementById("plotdiv1");
var plotdiv2 = document.getElementById("plotdiv2");
Plotly.newPlot(plotdiv1, [trace1]);
Plotly.newPlot(plotdiv2, [trace2]);
window.addEventListener("resize", function() {
Plotly.Plots.resize(plotdiv1);
Plotly.Plots.resize(plotdiv2);
});
.plot-div {
max-width: 100%;
}
.plot-col {
flex: 0 0 50%;
}
.my-container {
display: flex;
flex-direction: row;
flex-wrap: wrap;
width: 100%;
height: 100%;
}
<script src="https://cdn.plot.ly/plotly-latest.min.js"></script>
<body>
<div class="my-container">
<div class="plot-col">
<div id="plotdiv1" class="plot-div"></div>
</div>
<div class="plot-col">
<div id="plotdiv2" class="plot-div"></div>
</div>
</div>
</body>
JSFiddle: https://jsfiddle.net/bd0reepd/
Probablemente no entiendo bien cómo funciona flexbox, pero si reemplazo las parcelas con imágenes, se encogen como se esperaba.
He intentado depurar esto y encontré la función interna plotAutoSize , que llama window.getComputedStyle y establece el tamaño de la trama en consecuencia. He usado console.log para ver los valores de retorno de window.getComputedStyle y se "atascan" en el tamaño más grande cuando la ventana se contrae.
¿Cómo puedo hacer que las parcelas se reduzcan para que se ajusten a la ventana y permanezcan uno junto al otro en la misma fila?