anatp_123
anatp_123

Reputation: 1205

How to get rid of css inherited from a css file?

I have original.css file that i can't remove or change from the page. original.css

table {
    border-collapse: collapse;
    border-spacing: 0;
}

The radio buttons are showing a border and only way it seems to go away its when using chromedev tool I remove border-collapse:collapse from the original.css. I been trying to do overwrite it using the code below but nothing works. Any suggestion on how to remove border?

enter image description here

<style>
input[type="radio"] {
   margin-left: 10px;
   margin-right: 1px;
   border: none;
   border-spacing: 0;
   CellSpacing:-1;
}
</style>
<div class="contact-input-item" style="padding-left: 8.9cm; ">
     <label><b>By:</b> 

    <asp:RadioButtonList ID="send_by" runat="server" RepeatDirection="Horizontal" CssClass="rbl" BorderStyle="None" Style="display: none">
    <asp:ListItem Text="Email" Value="Email" />  <asp:ListItem Text="fax" Value="fax" />
    </asp:RadioButtonList></label>

Upvotes: 2

Views: 108

Answers (1)

Raydot
Raydot

Reputation: 1576

More specific CSS will override less specific css. So if you can use the class name as well as the type of item inside of your style tags that might be able to push out that "Table" specification.

<style> .contact-input-item input {...etc...} </style>

Then as a last resort you can use !important:

<style> 
  .contact-input-item input {
           border-collapse:separate !important;
  } 
</style>

Upvotes: 3

Related Questions