News:

Looking for documentation? Take a look on our wiki

Main Menu

Category Image Alignment

Started by Brockney, July 05, 2016, 00:45:08 AM

Previous topic - Next topic

Brockney

Joomla 3.6.4
Virtuemart 3.0.18

Brockney

Hi,

I am finishing off a site on Joomla for E-Cigarettes and Vapes. I'm reasonably happy with it, although there is a slight difference between the image alignment on a laptop and a mobile.

On the laptop all of the Category images are centered.

On a mobile they are left aligned.

This is only the case for Category images. For Product images they are centered on both devices.

Would anybody know how I can make the Category images appear centered on a mobile?
Joomla 3.6.4
Virtuemart 3.0.18

jenkinhill

Kelvyn
Lowestoft, Suffolk, UK

Retired from forum life November 2023

Please mention your VirtueMart, Joomla and PHP versions when asking a question in this forum

GJC Web Design

plus it will simply be css ... Firebug and correct
GJC Web Design
VirtueMart and Joomla Developers - php developers https://www.gjcwebdesign.com
VM4 AusPost Shipping Plugin - e-go Shipping Plugin - VM4 Postcode Shipping Plugin - Radius Shipping Plugin - VM4 NZ Post Shipping Plugin - AusPost Estimator
Samport Payment Plugin - EcomMerchant Payment Plugin - ccBill payment Plugin
VM2 Product Lock Extension - VM2 Preconfig Adresses Extension - TaxCloud USA Taxes Plugin - Virtuemart  Product Review Component
https://extensions.joomla.org/profile/profile/details/67210
Contact for any VirtueMart or Joomla development & customisation

Brockney

Thank you both very much for your replies

I am using Joomla 3.5.1 and Virtuemart 3.0.14

The website is live at www.brockneysbaseline.website

An example of where the issue arises is brockneysbaseline.website/index.php/online-store/e-liquids

I am not fully aware of css (yet), I am still learning the entry stages

If you can help me overcome this issue it will be a great help because in general I am happy with the website

Many thanks
Joomla 3.6.4
Virtuemart 3.0.18

Spiros Petrakis

Add the following to the end of temlpate.css file of your template or in the custom.css file if your template has such an option.

.category-view .category img {
  display: block;
  margin: 0 auto;
}
Joomla templates and extensions development
https://www.yourgeek.gr

Brockney

Oh my GOSH!!

Thank you, that was so easy and straightforward and has certainly inspired me to learn a lot more about css as well!

Works perfectly!  :D

Thank you for your help!
Joomla 3.6.4
Virtuemart 3.0.18