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

-- 



Reply via email to