0

No se por que me imprime medio div si para imprimirlo uso el mismo metodo:

introducir la descripción de la imagen aquí

codigo html:

 <div class= "blocks">
                <div id="show_current_products" v-if = "showcurrentProduct == true">
                    <label v-for="row in actuallist">Actual product's name: {{row.name}}</label>
                    <label v-for="row in actuallist">Actual product's lot: {{row.lot}}</label>
                </div>
            </div>

aqui esta otra parte en la que uso el mismo metodo para imprimir pero no me da error:

introducir la descripción de la imagen aquí

codigo html:

<div class = "blocks">
                <div id="show_previous_products" v-if = "showpreviousProduct == false">
                    <h1>Previous product:</h1>
                    <label v-for="row in list" >Previous product's name: {{row.name}}</label>
                    <label v-for="row in list" >Previous product's lot: {{row.lot}}</label>
                    <label v-for="row in list" >Previous product's quantity packed: {{row.quantity_packed}}</label>
                    <label v-for="row in list" >Previous product's quantity of pallets: {{row.pallet}}</label>
                </div>
            </div>

como podran ver en ambos casos uso v-for para los label, pero en el primero siempre me imprime medio div, no imprime medio div si uso table, es decir:

 <div class= "blocks">
                <div id="show_current_products" v-if = "showcurrentProduct == true">
                    <table id="list" v-for="row in actuallist">
                        <tr>
                            <td>
                                <label>Actual product's name: {{row.name}}</label>
                            </td>
                        </tr>
                        <tr>
                            <td>
                                <label>Actual product's lot: {{row.lot}}</label>
                            </td>
                        </tr>    
                        <tr>    
                            <td>
                                <label>Quantity to package: {{row.quantity_to_package}}</label>
                            </td>
                        </tr>    
                        <tr>
                            <td>
                                <label>Quantity of pallets: {{row.pallets}}</label>
                            </td>
                        </tr>
                        <tr>
                            <td>
                                <label>Quantity of finished pallets: {{row.finished_pallets}}</label>
                            </td>
                        </tr>
                    </table>
                </div>
            </div>

por que pasa esto??? me esta volviendo loco :(

2
  • ¿Has comprobado que el problema no es el height del div padre?
    – Juan José
    Commented el 7 jun. 2020 a las 12:59
  • ¿Cuál es el CSS?
    – Alvaro Montoro
    Commented el 8 jun. 2020 a las 0:33

1 respuesta 1

0

Prueba integrando un min-height: $medida-minima; para asegurarte que cuando se tenga el tamaño mínimo y pueda mostrarlo de manera adecuada, por otra parte si pudieras agregar una parte de tu CSS seria de mucha ayuda. Saludos.

.blocks{
   background-color: #2b880e;
   width: 50%;
   min-height: 120px;
   padding: 10px;
   margin:10px;
   color: white;
}
<div class = "blocks">
  <div id="show_previous_products_1">
      <h1>Previous product:</h1>
      <p v-for="row in list" >Previous product's name: </p>
      <p v-for="row in list" >Previous product's lot: </p>
      <p v-for="row in list" >Previous product's quantity packed: </p>
      <p v-for="row in list" >Previous product's quantity of pallets: </p>
  </div>
</div>

<div class = "blocks">
  <div id="show_previous_products_2">
      <h1>Previous product:</h1>
      <p v-for="row in list" >Previous product's name: </p>
      <p v-for="row in list" >Previous product's lot: </p>
  </div>
</div>

<div class = "blocks">
  <div id="show_previous_products_2">
      <h1>Previous product:</h1>
      <p v-for="row in list" >Previous product's name: </p>
      <p v-for="row in list" >Previous product's lot: </p>
      <p v-for="row in list" >Previous product's quantity packed: </p>
  </div>
</div>

Tu Respuesta

By clicking “Publica tu respuesta”, you agree to our terms of service and acknowledge you have read our privacy policy.

¿No es la respuesta que buscas? Examina otras preguntas con la etiqueta o formula tu propia pregunta.