responsive thumbs

[radmauro]

Hi, in my responsive joomla template I have 590 px for the phoca-category width. I need 3 or 4 thumbs for each row, and it is simple to calculate thumb width for desktop. But I can not solve for tablets (vertical) and phones because the thumbs remain the same size and I have an unpleasant white space to the right.
In my responsive joomla template, images resize (scale) automatically within certain parameters and limits. How to do it into Phocagallery?
A second question, please: how to increase vertical space between thumbs boxes?
Best

[ReptilienWohnzimmer]

margin -left: 10px;
margin-right: 10px;
margin-top: 10px;
margin-bottom: 10px;

oder

padding -left: 10px;
padding-right: 10px;
padding-top: 10px;
padding-bottom: 10px;

[christine]

Hi Best,

PG is responsive. See examples: https://www.phoca.cz/joomla3demo/category/1-celebration, https://www.phoca.cz/phocacartdemo/phoca-gallery

About your first questions: Would be useful to see your URL.

A second question, please: how to increase vertical space between thumbs boxes?

PG version 4.3.4 > try to add following code at the end of your template.css:

Code: Select all

div.pg-cv-box.item.pg-grid-sizer {
margin-bottom: 20px;
}

Kind regards, Christine
---------------------------------
Hi Alexander erst jetzt Dein post gesehen. Danke für Deine Hilfe.
Wo soll er diese Werte reingeben? Geht ja glaub ich u.a. um tablets (weiß nicht ...)
OT: Mein obiger Code betrifft jetzt rein nur den gewünschten vertikalen Abstand.

[ReptilienWohnzimmer]

servus Christine,

hier mal der Pfad zur Datei:
/media/com_phocagallery/css/custom/default.css DORT Zeile 56 BEI MIR!!!

Einfach mit der Maus auf eine obere Ecke der Box mit rechtsklick und dann auf untersuchen gehen. Es werde alle Codes für die Box angezeigt. Hintergrundfarbe, Schriftfarbe Border ... Dort den gewünschten " margin- ... : 10 oder 20px; eintragen.
Man sieht sofort im Browser, was sich ändert. Wenn alles OK, diesen Code in die entsprechende Datei einfügen und speichern.

LG Alexander

[christine]

Hallo Alexander,

ja natürlich, mach es ja auch nicht anders (das mit Code untersuchen)
OT: Hab mir gleich Deine Zeile 56 bei Dir angesehen (eigentlich 58). Nun ja, paddings/margins sind bereits default eingestellt. Deine veränderten Werte sind darunter, welche die oberen (noch existierenden) überschreiben. Sollten jetzt aber englisch weiter machen ....

@ Best,
you see colleague and I were talking about your problems

Alexander meant: you could try to change either with paddings and or margins in: .pg-cv-box
Nevertheless would be useful to see it live.

Kind regards, Christine

[radmauro]

Thank you for very quick reply.
See please http://www.rideraddict.com/phoca-test
(I have not changed yet highslideJS to get correct size thumbs into their boxes on mobile, but I know how to do).
The thumb images should resize (scale) automatically within certain parameters and limits, but dont.

[Jan]

radmauro
Hi, on your site, the fixed width and height for images are enabled. Did you set responsive parameter to yes in Phoca Gallery

Jan

[radmauro]

Ops! Too many options ;) I don't find it.... (V 4.2.1)

[Jan]

Hi, first of all, update to the latest version, 4.3.4.

Jan

[radmauro]

Ok Jan. Thankyou very much.
mauro