1

<?php
	include "header.php";

		require 'conexion.php';
?>
<!DOCTYPE html>
<html lang="es">
<head>
<meta charset="utf-8">
	
	<meta name="decription" content="etiquetas html5">
	
	
</head>

	<div class="shoes-grid">
		<div class="products">
			<h5 class="latest-product">Listado de Productos</h5>
		</div>
		<div class="product-left">
			
<?php

	$link = mysqli_connect ('localhost', 'root', '', 'catalogo');
	$sql = 'SELECT p.idProducto, p.prdNombre, p.prdPrecio, m.mkNombre, c.catNombre, p.prdPresentacion, p.prdStock, p.prdImagen
            FROM productos AS p
            INNER JOIN marcas AS m
            ON m.idMarca = p.idMarca
            INNER JOIN categorias AS c

            ON c.idCategoria = p.idCategoria
            ORDER BY idProducto';
    $resultado = mysqli_query($link, $sql) or die( mysqli_error($link) );
    mysqli_close($link);

    while ( $fila = mysqli_fetch_array( $resultado ) ){

?>
<div class="col-sm-4 col-md-4 chain-grid">
				<a href="?page=producto"><img src="images/productos/<?php echo $fila['prdImagen']; ?>" class="img-responsive"></a>
				 <div class="grid-chain-bottom">
				 <h6><a href="#"><?php echo $fila['prdNombre']; ?></a></h6>
				
					<h6><a href="?page=producto">Presentacion:<?php echo $fila['prdPresentacion'];  ?></a></h6>
					<div class="star-price">
						<div class="dolor-grid"> 
							<span class="actual">Precio:<?php echo $fila['prdPrecio'];  ?></span>
							<br>
							<span class="actual">Stock:<?php echo $fila['prdStock'];  ?> </span>
						</div> 
						<a class="now-get get-cart" href="?page=producto">VER MÁS</a> 
						<div class="clearfix"></div>
					</div>
				</div>
			</div>
			<?php
}
?>
			
			<div class="clearfix"></div> 
		  </div>
		<div class="clearfix"> </div>
	
	</div> 
	</html>
	<div class="col-md-8"> 
   
	<?php include "footer.php"; ?>

*el código que tengo muestra los divs correctamente,(con toda la información de la base de datos) pero la posición es el problema, solo muestra dos divs en una fila , y deja un espacio vacio al lado derecho , luego en la otra fila lo mismo siempre mostrando solo dos divs hasta acabar , estoy usando bootstrap para la estructura , pero no se si podría arreglarlo asi o solo con una hoja de css

1
  • Asegurate que las filas (row) contengan 3 divs con clase col-sm-4 o col-md-4 dependiendo de lo que usas.
    – Reynald0
    el 23 ene. 2018 a las 15:45

1 respuesta 1

1

Como hay codigo PHP y MYSQLi, no podremos verificar en el snippet si funciona o no.

Te recomiendo utilizar:

<div class="container">
<div class="row">

Para contener lo que seria el "contenido"

En tu codigo no tienes el cierre de <div class="col-md-8">

Aquí estas dividiendo el contenido en 2: columna de 4 y columna de 8.

Si quieres 3 divs, tienes que dividir 12 (el total definido por bootstrap width:100%; en 3).

Es decir, tres col-md-4.

Posible Solución: (Si sobra espacio)

Puedes utilizar offset que brinda Bootstrap Grid System

Mueve las columnas hacia la derecha usando las clases .offset-md- *. Estas clases aumentan el margen izquierdo de una columna por * columnas. Por ejemplo, .offset-md-4 mueve .col-md-4 en cuatro columnas.

.offset-md-4

Lee el archivo de Bootstrap Grid System.

Tu Respuesta

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

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