DrZ
DrZ

Reputation: 181

How to remove a table border from a jqGrid cell

I'm using the jQuery UI library + CSS as well as the jqGrid CSS for an ASP GridView I have. The problem I'm running into is that if I add a <table> inside my <ItemTemplate> I always get a border around the table.

http://dl.dropbox.com/u/6032362/Capture.PNG

I've tried everything I can think of to get rid of the border and I can't. I've tried inline CSS and nothing is working. I even tried to add the following to the jQuery UI CSS file (my table is called controlTable)

.ui-widget-content table#controlTable { border: 9px solid red; }

It works by adding a think red border around the table. But the cells still have an internal blue line.

http://dl.dropbox.com/u/6032362/Capture2.PNG

Any ideas what I can do to get rid of it?

Thank you

Upvotes: 0

Views: 3267

Answers (1)

user191966
user191966

Reputation:

Did you know about css keyword !important? It's used to force override over declarations that otherwise take priority (priority of css declarations is based on order of placement and precision/specificity of selectors); anyway, try this:

.ui-widget-content table#controlTable td { border: 9px solid red !important; }

Every time your css like that stubbornly won't be applied (as something else overrides your declaration), try adding !important after the value, but before the semi-colon:

border: 9px solid red !important;

Also notice the exclamation point! +1

Upvotes: 2

Related Questions