I've got an app that uses SQLFORM.grid in a number of pages. At the end of each row in my grid, the View, Edit, Create, Delete buttons are rendered as text links with no horizontal margin or padding, ie they render like this:
*ViewEditCreateDelete* I'd like to at least put some horizontal space between them and, perhaps, render them as nice looking buttons. The generated html for each button looks like this: <a class="w2p_trap button" href=" /init/default/test_report_manage/view/t_test_report/2160?_signature=108be65dee5dcf9a3bf4f41a57e937366e685050<http://localhost:8000/init/default/test_report_manage/view/t_test_report/2160?_signature=108be65dee5dcf9a3bf4f41a57e937366e685050> "> <span class="icon magnifier"</span> <span class="buttontext button" title="View">View</span> </a> Using Chrome Developer Tools, I can see that the only css rules applied to this element are the following in style.css file from my theme (CorporateOffice). /** Common Styles */ body { margin: 30px 0 20px 0; padding: 0; background: #D7D7BD; text-align: justify; line-height: 25px; font-family: Tahoma, Arial, Helvetica, sans-serif; font-size: 11px; color: #3C3C37; } a { color: #005880; } So my question is "What's the cleanest way to alter the style for the View, Edit, ... buttons in all the grids in my app without affecting any other items?" Thanks, Mike --