nexxuseis Posted October 5, 2012 Share Posted October 5, 2012 (edited) Quiero hacer lo siguiente, he visto plantillas en donde la lista de productos se le asigna estilos css a la lista en general y otro estilo al primer item, les muestro mi web de ejemplo http://saltacarteras...p?id_category=5 ul#product_list li { background: #f7f7f7 url('../img/block_category_item_bg.jpg') repeat-x; padding: 0px; height: 312px; min-height: 352px; margin-bottom: 0em; border: solid 1px #d0d3d8; float: left; width: 254px; margin-right: 0px; margin-left: 14px; margin-bottom: 14px; text-align: left; } ul#product_list li.first_item { width: 254; margin-left: 0} En ul#product_list li es general y ul#product_list li.first_item seria lo mismo con la diferencia que no tiene margin-left, para que todos los productos queden bien alineados con el ancho de la columna. El problema es que los items que le siguen abajo no cumplen esa funcion, alguien sabe que debo hacer para que los de abajo (siempre el primer item) me lo tome ?, les muestro una imagen. Gracias Edited October 6, 2012 by nexxuseis (see edit history) Link to comment Share on other sites More sharing options...
nadie Posted October 6, 2012 Share Posted October 6, 2012 Quiero hacer lo siguiente, he visto plantillas en donde la lista de productos se le asigna estilos css a la lista en general y otro estilo al primer item, les muestro mi web de ejemplo http://saltacarteras...p?id_category=5 ul#product_list li { background: #f7f7f7 url('../img/block_category_item_bg.jpg') repeat-x; padding: 0px; height: 312px; min-height: 352px; margin-bottom: 0em; border: solid 1px #d0d3d8; float: left; width: 254px; margin-right: 0px; margin-left: 14px; margin-bottom: 14px; text-align: left; } ul#product_list li.first_item { width: 254; margin-left: 0} En ul#product_list li es general y ul#product_list li.first_item seria lo mismo con la diferencia que no tiene margin-left, para que todos los productos queden bien alineados con el ancho de la columna. El problema es que los items que le siguen abajo no cumplen esa funcion, alguien sabe que debo hacer para que los de abajo (siempre el primer item) me lo tome ?, les muestro una imagen. Gracias Prueba asi: ul#product_list li.first_item { width: 253px; margin-left: 14px !important; } O Prueba asi: ul#product_list li.first_item { width: 253px; } Sin asignar nada, y sin colocar la instrucción del margin-left. Link to comment Share on other sites More sharing options...
nexxuseis Posted October 6, 2012 Author Share Posted October 6, 2012 Si lo pongo asi me toma el primer item como todos los demas, el "margin-left", yo quiero que el primer item y los que vienen abajo del mismo no tome el margin-left. Por ej. http://livedemo00.template-help.com/prestashop_39947/category.php?id_category=2 El item de la izquiera (al lado del carro) y todos los que estan debajo de el, tienen margin-right 0, y los otros tienen margin-right 20px Link to comment Share on other sites More sharing options...
nadie Posted October 6, 2012 Share Posted October 6, 2012 ¿Y como quieres dejarlo exactamente? ¿Puedes mostrar un dibujo, de la forma que lo quieres dejar exacto? Link to comment Share on other sites More sharing options...
nadie Posted October 6, 2012 Share Posted October 6, 2012 Yo los veo ahora totalmente cuadrados y alineados ¿No lo quieres asi? Link to comment Share on other sites More sharing options...
nexxuseis Posted October 6, 2012 Author Share Posted October 6, 2012 En la imagen que mostré en el 1er post, el pimer item no tiene margin-left, los otros si, fijate que el que esta abajo del primer item tiene margin-left como los otros, yo quiero que ese item (el que esta con la flecha verde) me lo tome igual que el de arriba, si hago como tu dices todos tienen margin-left y eso es lo que no quiero, quiero que todos los que estan al lado del left_column no tengan margin. Se que se puede porque en la plantilla monster lo estoy viendo. Link to comment Share on other sites More sharing options...
nadie Posted October 6, 2012 Share Posted October 6, 2012 Te sigo sin entender. Yo en tu web, veo esto: Ahora señalame en la imagen paso a paso, linea a linea, como lo quieres dejar. Link to comment Share on other sites More sharing options...
nexxuseis Posted October 6, 2012 Author Share Posted October 6, 2012 (edited) AHi esta, si le pongo margin-left 0, y le pongo margin-right 14 estoy en la misma, porque el desnivel con los divs de arriba va a ser lo mismo pero en este caso a la derecha, es inapreciable, lo se, pero al saber que se puede quiero lograrlo. Edited October 6, 2012 by nexxuseis (see edit history) Link to comment Share on other sites More sharing options...
nexxuseis Posted October 6, 2012 Author Share Posted October 6, 2012 Como esta web http://livedemo00.template-help.com/prestashop_39947/category.php?id_category=2 Alineacion perfecta de productos segun los divs de arriba Link to comment Share on other sites More sharing options...
nadie Posted October 6, 2012 Share Posted October 6, 2012 Prueba esto: Fichero: /themes/prestashop/css/product_list.css Busca esto: ul#product_list { margin-top: 2em; list-style-type: none; } Y dejalo asi: ul#product_list { margin-top: 2em; list-style-type: none; margin-left: -13px; } Y dime si es eso lo que quieres. Link to comment Share on other sites More sharing options...
nexxuseis Posted October 6, 2012 Author Share Posted October 6, 2012 Nadie: Eres grande, lo sabes, genio, muchas gracias! Creo que lo dificil fue la interpretacion, es muy dificil explicar jeje. Saludos Link to comment Share on other sites More sharing options...
nadie Posted October 6, 2012 Share Posted October 6, 2012 Nadie: Eres grande, lo sabes, genio, muchas gracias! Creo que lo dificil fue la interpretacion, es muy dificil explicar jeje. Saludos Un placer ayudarte y servirte! Un saludo y recuerda que estaremos en el foro, para guiarte por este mundo oscuro y tenebroso. Link to comment Share on other sites More sharing options...
Recommended Posts