Joomla Tags in 2 Columns - RocketTheme Template

Question

I'd love to know how I can create Joomla tags in two columns.

Example of what I have: http://visualedgehosting.com/dfw-chimera/leadership/

Appreciate any help in advance,

Answer 1

You are using a RocketTheme template, and I see there is already a custom.css file.

templates/rt_chimera/css/rt_chimera-custom.css

The following css is an example you can use as starting base, to give the layout you want on that page. Place this code, at the end of your rt_chimera-custom.css file.

.tag-category .list-striped li {
    width: 45%;
    float: left;
}
.tag-category .list-striped li.cat-list-row0 {
    margin-right: 3%;
}

.tag-category .list-striped li img {
    width: 100% !important;
    max-width: 100% !important;
    margin: 0;
    padding: 8px 15px 8px 0px;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
}

Answer 2

There may be some clearer option in your template, but you could add the following lines to your CSS:

   .tag-category .list-striped li img {
        max-width: 25% !important;
        width: 100% !important;
   }

   .list-striped li, .list-striped dd, .row-striped .row, .row-striped .row-fluid {
        display: inline-block !important;
        width: 47% !important;
    }

Make sure this CSS is loaded after your template providers CSS

Answer 3

Since the striped grey background looked strange in a two column format, I added this to remove it retaining the hover:

.list-striped li:nth-child(odd), .list-striped dd:nth-child(odd), .row-striped .row:nth-child(odd), .row-striped .row-fluid:nth-child(odd), .cat-list-row0 {
    background-color: rgba(232, 102, 102, 0);
}

.list-striped li:hover, .list-striped dd:hover, .row-striped .row:hover, .row-striped .row-fluid:hover, .cat-list-row0:hover, .cat-list-row1:hover {
    background-color: #ddd!important;
}

Thanks again!