CODEWITHSUNDEEP
css
petko_stankoski
petko_stankoski

Reputation: 10713

Make textbox ignore style in css

I have a textbox with id="Email" in my view and I need the id to stay as it is. However, there is a #Email fields in a css file and my textbox gets the style in that fields. How can I make it to ignore that style?

Upvotes: 0

Views: 739

Answers (8)

Jukka K. Korpela
Jukka K. Korpela

Reputation: 201558

You cannot make the CSS setting just ignored. You need to override it, one way or another. That is, you cannot tell the browser to do what it would do if the style setting were not present, but you can tell it display elements your way.

If you have several text input fields and one of them is affected by some CSS rule, then it is normally best to set the style of all text input fields uniformly (not necessarily the same, since at least the widths might be varied to promote usability). But since there is a CSS rule using an id selector, which has high specificity, you need to take that into account so that your rule will get applied to that element too. For example:

input, input#Email {
  font: 100% Calibri, sans-serif;
  color: black;
  background: white;
}

Upvotes: 0

Katai
Katai

Reputation: 2937

You could define the 'style=""' attribute (explicit style for the textbox) and overwrite the styles delivered, manually. But you cant just globaly 'deny' all styles.

<textbox id="email" style="...">
...
</textbox>

Upvotes: 0

user1432124
user1432124

Reputation:

in your css file try to write some parent element id before #email which is not present in case of <input id="email">

Upvotes: 0

Praveen Kumar Purushothaman
Praveen Kumar Purushothaman

Reputation: 167172

Can you group the #Email in your CSS inside the required place? For example, may be the #Email should be coming inside some .article or something.

Instead of having CSS like:

#Email {background: #ccc;}

You can consider writing as:

.article #Email, p #Email {background: #ccc;}

Or, alternatively, you can do this way. Since you know that you won't want the input with #Email to be styled, you can write a CSS:

input#Email {background: none;}

And reset the above global styles.

Hope this helps! :)

Upvotes: 2

Siva Charan
Siva Charan

Reputation: 18064

Better change ID for your text box from Email to Other ID

Upvotes: 0

Jeff Watkins
Jeff Watkins

Reputation: 6359

Your options are:

  1. Change the CSS, it points to an ID explicitly so you'd expect it to do that, ID bound styles aren't my favourite anyway, consider making it a regular style so you can use class="email" in your markup or making it more specific so it isn't a blanket ID binding
  2. Change the ID in the markup (you've indicated you can't do this)
  3. Remove the class using jQuery, messy and hacky

Upvotes: 0

sandeep
sandeep

Reputation: 92803

If you want to overwrite you property. Write like this

input#Email{
 color:red;
}

Upvotes: 0

Sampson
Sampson

Reputation: 268344

You can't, not without changing the ID or overwriting the styles imposed. This is what CSS does. Try to avoid ambiguities like this in your stylesheets.

Upvotes: 0

Related Questions