2 Kolumny W Wersji Mobilnej Problem

[maksww]

Witam
Mam mam problem ze zrobieniem dwóch kolumn w wersji mobilnej prestashop 1.6.1.1

Srona www.sortshop.co.uk
w pliku product-list  zmieniłem
 
 
to:

col-xs-12 col-sm-4 col-md-3{else} col-xs-12 col-sm-4 col-md-3

na
 

col-xs-6 col-sm-4 col-md-3{else} col-xs-6 col-sm-4 col-md-3

 
Noi ok dwie kolumny są tylko się rozjeżdżają trochę,  są  wolne przestrzenie 

 

W pliku default-bootstrap/js/global.js 

Próbowałem zmienić

z

('.product_list > li').removeClass('col-xs-12').addClass('col-xs-12 col-sm-6 col-md-4')

na

('.product_list > li').removeClass('col-xs-12').addClass('col-xs-6 col-sm-6 col-md-4')

Niestety nic nie pomogło, Jak by ktoś miał pomysł co z tym zrobić bym był wdzięczny.

Ps Jak by ktoś chciał zrobić podobny zabieg to po edycji pliku product-list wywala bloki nowości, najczęściej kupowanych i promocji. Trzeba jeszcze raz je przeinstalować i będzie ok

[krzysiek_web]

Jeżeli ustawić col-xs-6 i col-xs-6 to nie ma możliwości aby były wolne pola (boxy nie były obok siebie).

W stylu css może masz ustawioną osobną wartość szerokości w px ?

 

Edycja// Na screenie widać różne wysokości.

Daj im stałe wysokości w max-height i sprawdź.

Edited February 14, 2016 by krzysiuus (see edit history)

[maksww]

Nie zmieniałem żadnych wymiarów.

Pousuwałem parę przycisków i myślałem przez chwile że to wina tego ale

zrobiłem identyczny zabieg na czystej prescie www.flavourtree.co.uk i efekt taki sam. 

[krzysiek_web]

Na screenie widać różne wysokości.

Daj im stałe wysokości i sprawdź.

[maksww]

Witam

Po zmianie wysokości bez zmian, tylko stała wysokość nie pomogła by bo rozciągało by obrazki bo zmianie wielkości ekranu.

[krzysiek_web]

Rozciągnij div zawierający ten box. Jak rozciągasz obrazek to... wiadomo.

Podaj www.

[maksww]

www.sortshop.co.uk , tylko mam włączona inteligenta pamieć podręczną dla css inaczej szablon się sypie, Tutaj jest czysta instalka z takim samym problemem www.flavourtree.co.uk

[krzysiek_web]

Na szybko np.
 

.product_list li {
    min-height: 370px;
}

http://s25.postimg.org/qlu8sr1hr/123.png

 

PS. Przy tak małej rozdzielczości powinien być jeden produkt w wierszu.

[maksww]

ul.product_list.grid > li .product-container {
    background: #fff;
    padding: 0;
    min-height: 370px;
    position: relative; }

Zrobiłem w ten sposób i działa ale tylko na stronie głównej po przejściu w daną kategorie jest dalej źle.

[krzysiek_web]

Na podstronie masz strukturę dla odwołania:

ul.product_list.grid > li .product-container {

?

[maksww]

Jednak to nie tu, po kilku krotnym odświeżeniu  jak zmieniły się produkty dalej pojawia się puste pole.

Zrobiłem zabieg na czystej preście to w ogolę efektu nie było widać. Jak by się przydał link do czystej presty www.flavourtree.co.uk

[krzysiek_web]

Kompilacje szablonu masz włączoną w sekcji wydajność?

Na stronie głównej zmiany w końcu widać czy nie?

[maksww]

Tak kompilacja jest włączona. Na pierwszy rzut oka wygląda jak by działało tylko po przejściu przykładowo w promocje jak trafi się produkt np z dłuższym opisem to już znowu się przestawia i robi sie puste pole.

[krzysiek_web]

Ustaw ograniczenia wyświetlania znaków w opisie produktu na liście kategorii.

[maksww]

Zmieniłem długość znaków z 45 na 35

Dla zainteresowanych tematem robi się to w pliku product-list.tpl. 

Tam gdzie 35 wpisujemy swoją wartość

<a class="product-name" href="{$product.link|escape:'html':'UTF-8'}" title="{$product.name|escape:'html':'UTF-8'}" itemprop="url" >
							{$product.name|truncate:35:'...'|escape:'html':'UTF-8'}
						</a>

To jeszcze nie pomogło ale po zmianie czcionki z 17 na 16 jest już ok

Dzięki wielkie za pomoc !! Mam nadzieje że temat komuś się przyda