Jump to content

espacios en blanco en las listas de procutos

Danyal

By Danyal
in Discusión general

 Share

Recommended Posts

Danyal Newbie

Danyal

Posted
Posted

Saludos,

 

Estoy teniendo un problema al lista los productos de una categoría o subcategoría, Me deja espacios en blanco entre producto.

Al visualizar la web en el navegar en un 80% el problema desaparece.

El tema que uso se llama Melani, creado en idioma Ingles y frances.

Este es el código de la sección  pero no logro corregir el problema

/* category page */
@media (max-width: 767px) {
  #left-column, #content-wrapper, #right-column {
    width: 100%; } }
#js-product-list-top ul.display {
  float: left;
  margin-right: 50px;
  position: relative;
  z-index: 1; }
  @media (max-width: 1199px) {
    #js-product-list-top ul.display {
      margin-right: 15px; } }
  #js-product-list-top ul.display li {
    width: 40px;
    height: 40px;
    line-height: 40px;
    padding: 0;
    margin-right: 10px;
    font-size: 0;
    display: inline-block;
    vertical-align: top;
    border: none;
    cursor: pointer;
    border-radius: 3px !important;
    color: #999999;
    text-align: center;
    background: #e7e7e7;
    -webkit-transition: all 300ms ease-in;
    -moz-transition: all 300ms ease-in;
    -ms-transition: all 300ms ease-in;
    -o-transition: all 300ms ease-in;
    transition: all 300ms ease-in; }
    #js-product-list-top ul.display li i:before {
      font-size: 26px;
      vertical-align: middle; }
    #js-product-list-top ul.display li:hover, #js-product-list-top ul.display li.selected {
      color: #fff;
      background: #ff7e67;
      -webkit-transition: all 300ms ease-in;
      -moz-transition: all 300ms ease-in;
      -ms-transition: all 300ms ease-in;
      -o-transition: all 300ms ease-in;
      transition: all 300ms ease-in; }

.quickview .modal-content {
  background: white; }

#js-product-list .product_content.list .js-product-miniature {
  border: 0;
  margin-bottom: 60px; }
  #js-product-list .product_content.list .js-product-miniature:before {
    display: none; }
  #js-product-list .product_content.list .js-product-miniature:hover {
    box-shadow: none; }
  #js-product-list .product_content.list .js-product-miniature .new {
    left: 25px; }
  #js-product-list .product_content.list .js-product-miniature .discount-percentage {
    display: none; }
  #js-product-list .product_content.list .js-product-miniature .product_desc {
    text-align: left;
    position: static;
    padding: 0 0 0 15px; }
    #js-product-list .product_content.list .js-product-miniature .product_desc .product_name {
      font-size: 24px;
      line-height: normal; }
    #js-product-list .product_content.list .js-product-miniature .product_desc .hook-reviews {
      float: none;
      width: 100%;
      position: static;
      opacity: 1;
      box-shadow: none;
      visibility: inherit; }
    #js-product-list .product_content.list .js-product-miniature .product_desc .product-price-and-shipping {
      margin-top: 18px; }
      #js-product-list .product_content.list .js-product-miniature .product_desc .product-price-and-shipping .price {
        font-size: 24px; }
      #js-product-list .product_content.list .js-product-miniature .product_desc .product-price-and-shipping .regular-price {
        font-size: 22px; }
    #js-product-list .product_content.list .js-product-miniature .product_desc .cart .ajax_add_to_cart_button {
      font-size: 16px;
      padding: 9px 25px;
      background: #ff7e67;
      color: #fff; }
      #js-product-list .product_content.list .js-product-miniature .product_desc .cart .ajax_add_to_cart_button:hover {
        background: #333c4a;
        -webkit-transition: all 300ms ease-in;
        -moz-transition: all 300ms ease-in;
        -ms-transition: all 300ms ease-in;
        -o-transition: all 300ms ease-in;
        transition: all 300ms ease-in; }
    #js-product-list .product_content.list .js-product-miniature .product_desc .product-desc p {
      display: block;
      padding: 20px 0;
      line-height: 24px;
      font-size: 15px;
      margin-top: 10px;
      color: #707070; }
  @media (max-width: 479px) {
    #js-product-list .product_content.list .js-product-miniature .img_block, #js-product-list .product_content.list .js-product-miniature .product_desc {
      width: 100%; } }
@media (min-width: 1600px) {
  #js-product-list .product_content.grid .item-product:nth-child(4n+1) {
    clear: both; } }
@media (min-width: 992px) and (max-width: 1199px) {
  #js-product-list .product_content.grid .item-product:nth-child(3n+1) {
    clear: both; } }
@media (min-width: 480px) and (max-width: 991px) {
  #js-product-list .product_content.grid .item-product:nth-child(2n+1) {
    clear: both; } }
@media (max-width: 479px) {
  #js-product-list .product_content.grid .item-product {
    clear: both; } }
@media (min-width: 480px) and (max-width: 543px) {
  #js-product-list .product_content.grid .item-product {
    width: 50%; } }
#js-product-list .product_content.grid .item-product .js-product-miniature {
  margin-bottom: 40px; }
@media (min-width: 1200px) and (max-width: 1600px) {
  #js-product-list .product_content.grid .item-product {
    width: 33.33333% !important; } }

.owl-item.last-active .js-product-miniature {
  border-right: 1px solid transparent; }

@media (min-width: 480px) and (max-width: 543px) {
  #js-product-list .product_content .item-product.grid {
    float: left;
    width: 50%; } }
.inner-wrapper {
  position: relative;
  background: #fff; }

#category .inner-wrapper {
  z-index: 9; }

#index .inner-wrapper {
  padding: 0;
  margin: 0; }

#index #wrapper .breadcrumb-name {
  background: transparent;
  margin: 0;
  padding: 0; }

#wrapper .breadcrumb-name .breadcrumb_container {
  position: relative;
  background: #f1f1f1;
  text-align: center;
  padding: 57px 0;
  margin-bottom: 60px; }
#wrapper .breadcrumb-name .name_category {
  display: block;
  text-transform: uppercase;
  font-size: 24px;
  font-weight: 700;
  margin: 0;
  margin-bottom: 12px;
  text-align: center; }
#wrapper .breadcrumb-name .breadcrumb_container .breadcrumb {
  background: transparent;
  padding: 0;
  margin: 0; }
  #wrapper .breadcrumb-name .breadcrumb_container .breadcrumb ol {
    padding-left: 0;
    margin-bottom: 0; }
    #wrapper .breadcrumb-name .breadcrumb_container .breadcrumb ol li {
      display: inline; }
      #wrapper .breadcrumb-name .breadcrumb_container .breadcrumb ol li:after {
        content: "/";
        color: #292929;
        margin: 0.3125em;
        font-size: 10px; }
      #wrapper .breadcrumb-name .breadcrumb_container .breadcrumb ol li:last-child {
        content: "/";
        color: #777;
        font-size: 15px; }
        #wrapper .breadcrumb-name .breadcrumb_container .breadcrumb ol li:last-child:after {
          content: ""; }
      #wrapper .breadcrumb-name .breadcrumb_container .breadcrumb ol li a {
        color: #777;
        text-transform: capitalize;
        font-size: 15px;
        display: inline-block; }
        #wrapper .breadcrumb-name .breadcrumb_container .breadcrumb ol li a:hover {
          color: #ff7e67; }
#wrapper .breadcrumb-name .breadcrumb_container .breadcrumb[data-depth="1"] {
  display: none; }
#wrapper .category-cover {
  position: relative;
  z-index: 1; }
  #wrapper .category-cover h1 {
    font-size: 36px;
    text-transform: capitalize;
    font-weight: 500; }

.block-category {
  margin-bottom: 0;
  padding: 0;
  min-height: auto; }
  .block-category.card {
    box-shadow: none;
    border: 0; }

.block-category .category-cover {
  position: static; }
  .block-category .category-cover img {
    width: auto;
    height: auto; }

#products img, .featured-products img, .product-accessories img {
  margin: 0; }

.block-categories, #search_filters {
  box-shadow: none;
  background: #fff;
  padding: 0;
  margin-bottom: 30px; }

.block-categories a.h6 {
  font-size: 20px;
  color: #333c4a;
  text-transform: uppercase;
  font-weight: 700;
  display: block;
  position: relative;
  margin-bottom: 0;
  padding-bottom: 10px;
  border-bottom: 1px solid #ededed; }
.block-categories .category-sub-menu {
  margin: 0; }
  .block-categories .category-sub-menu li a {
    color: #898989; }
    .block-categories .category-sub-menu li a:hover {
      color: #ff7e67; }
.block-categories .category-sub-menu li[data-depth="0"] > a {
  font-size: 15px;
  line-height: 26px;
  margin: 0;
  text-transform: capitalize;
  font-weight: 400;
  display: block;
  position: relative;
  padding: 10px 0;
  color: #333c4a;
  border-bottom: 1px solid #ededed; }
.block-categories .category-sub-menu li[data-depth="1"] {
  font-size: 15px;
  line-height: 26px;
  margin: 0;
  text-transform: capitalize;
  font-weight: 400;
  display: block;
  position: relative;
  padding: 10px 0;
  color: #333c4a;
  border-bottom: 1px solid #ededed; }
.block-categories .category-sub-menu .category-sub-link {
  color: #333c4a;
  padding-left: 15px; }

#search_filters_wrapper #search_filters h4 {
  display: block;
  line-height: 30px;
  padding: 17px 0 13px 0;
  padding-left: 30px;
  font-size: 20px;
  font-weight: 700;
  text-transform: uppercase;
  color: #fff;
  margin: 0 0 30px;
  background: #ff7e67;
  border-top-left-radius: 3px;
  border-top-right-radius: 3px; }

 

image.thumb.png.83f9977ea56f2aa19a8dab9ff43ac57f.png 

 

 

 

Link to comment
Share on other sites
Danyal Newbie

Danyal

Posted
  • Author
Posted
36 minutes ago, Rolige said:

Hola,

El problema regularmente es por el titulo del producto, cuando uno de los elementos tiene el titulo en una o mas lineas que el resto, solo debes fijar un alto para el titulo y con eso lo solucionas.

 

Saludos!

Gracias por responder, entiendo lo que me indicas, pero usaba otro tema y no tenia este problema.

¿Es posible que otro aspecto me genere este problema?

Link to comment
Share on other sites
Rolige Explorer

Rolige

Posted
Posted

Como dije, el 100% de los problemas de este tipo que he visto antes los he solucionado danto un alto fijo a los elementos que estan variando, yo te dije el titulo porque regularmente es el titulo, pero si fuese otro el que esta variando su altura, tambien debes de darle altura fija.

 

Saludos!

Link to comment
Share on other sites
Danyal Newbie

Danyal

Posted
  • Author
Posted
On 13/8/2018 at 5:02 PM, Rolige said:

Como dije, el 100% de los problemas de este tipo que he visto antes los he solucionado danto un alto fijo a los elementos que estan variando, yo te dije el titulo porque regularmente es el titulo, pero si fuese otro el que esta variando su altura, tambien debes de darle altura fija.

 

Saludos!

Gracias por tu ayuda. así que doy por cerrado el tema.

Link to comment
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
 Share
Go to topic listing
×
×
  • Create New...