How to change Categories View from 3 columns to 2 columns

[vtpages]

Hello Jan, and everyone else here! Having an issue viewing a new site on my Samsung Galaxy S8. I have a menu item for Categories View (List of Categories), and it lays out the categories 3 columns across. The problem is that those category titles are getting all smashed into one another on that small screen and are unreadable. How can I address this to either (a) make it two columns across instead of three, or even better (b) make it responsive so that they flow down beneath one another instead of holding onto the 3-columns-across format? Thanks in advance, hope everyone is having a wonderful weekend!

[christine]

Hi,

Which template are you using? Would be useful to see it.

Just to show you from a demo https://www.phoca.cz/joomla3demo/phoca-download-demo for example (only):
.../media/com_phocadownload/css/main/phocadownload.css

Code: Select all

#phoca-dl-categories-box div.pd-categoriesbox {
    width: 28%;
    position: relative;
    float: left;
    margin: 1%;
    padding: 1%;
}

in above demo, there is a width of 28%

Kind regards
Christine

[vtpages]

Christine, thank you so much for your response! I tried several different values there to get it to lay out in two columns (50%, 40%, 35%), but the results were inconsistent across platforms. What I ultimately ended up doing was to make it 100% so that there is just a single column. Thanks again for the tip.

[christine]

Hi,

thank you for your feedback. As I wrote, it depends on template, e.g. bootstrap, grids, width of content (spans) etc.

Kind regards
Christine