Friday 6 July 2012

how to fix the pagination css in joomla 2.5

I've a website that I upgraded from Joomla 1.7 to Joomla 2.5 and I noticed that the article Pagination was looking very scruffy - in that it was just a bulleted list.  

Using Firebug for Mozilla I noticed that the call up for pagination comes from com_contact/views/

However I didn't need to change the HTML for the following fix.  If you add the following to you template.css ( or whatever .css file )

div.pagination ul{

}

div.pagination li{

}

div.pagination li.pagination-start{

}

div.pagination li.pagination-start span.pagenav{

}

div.pagination li.pagination-prev{

}

div.pagination li.pagination-prev span.pagenav{

}

div.pagination li span.pagenav{

}

div.pagination li a:link {

}

div.pagination li.pagination-next{

}

div.pagination li.pagination-next a:{

}

div.pagination li.pagination-end {

}

div.pagination li.pagination-end a:{

}


Now you can use Firebug to write css on the fly for all cells.  Here's all the I need to add though

div.pagination ul{
list-style-type:none !important;
margin-left: 240px;
}

div.pagination li{
float:left;
margin-left: 30px;
}

Take a look at the Anns Cottage News page for an example of it working.

No comments: