SitePoint Sponsor

User Tag List

Results 1 to 7 of 7
  1. #1
    SitePoint Member
    Join Date
    Mar 2012
    Posts
    3
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Load default values in inherited properties

    How can I reset the default values ​​in the properties that had their values ​​inherited from other css files ?

  2. #2
    SitePoint Member
    Join Date
    Mar 2012
    Posts
    3
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    I mean...
    How can I reset all the default values ​​in the properties that had their values ​​inherited from other css files ?

  3. #3
    billycundiff{float:left;} silver trophybronze trophy RyanReese's Avatar
    Join Date
    Oct 2008
    Location
    Whiteford, Maryland, United States
    Posts
    13,761
    Mentioned
    12 Post(s)
    Tagged
    0 Thread(s)
    Hi Leko_, welcome to Sitepoint .

    You can't do this manually, at least not with CSS. AFAIK there is no CSS library or even a JS library that exists for this.

    If you could copy all the elements from the other stylesheet (all the selectors I mean), you could just reset the values manually to "auto" or whatever the normal value is.

    Why would you want to even do this though...?
    Always looking for web design/development work.
    http://www.CodeFundamentals.com

  4. #4
    SitePoint Member
    Join Date
    Mar 2012
    Posts
    3
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    There is an element that I need to just set some properties on it and leave the rest as default, but there are many css files on it applied into the document and inherits many properties of their parent elements.
    But then I will set each one.
    Thanks !

  5. #5
    billycundiff{float:left;} silver trophybronze trophy RyanReese's Avatar
    Join Date
    Oct 2008
    Location
    Whiteford, Maryland, United States
    Posts
    13,761
    Mentioned
    12 Post(s)
    Tagged
    0 Thread(s)
    Well if it's just one element then I'd just manually reset it as I mentioned above. My comment isn't really feasible for any sort of large scale file. But one element should be no biggie . You're welcome!
    Always looking for web design/development work.
    http://www.CodeFundamentals.com

  6. #6
    It's all Geek to me silver trophybronze trophy
    ralph.m's Avatar
    Join Date
    Mar 2009
    Location
    Melbourne, AU
    Posts
    24,331
    Mentioned
    463 Post(s)
    Tagged
    8 Thread(s)
    You can just make a rule for that element that is more specific than any other rule.

    Or, you can take a shortcut and add !important to your preferred style. E.g.

    Code:
    p {color: red !important;

  7. #7
    Community Advisor silver trophybronze trophy
    dresden_phoenix's Avatar
    Join Date
    Jun 2008
    Location
    Madison, WI
    Posts
    2,821
    Mentioned
    34 Post(s)
    Tagged
    2 Thread(s)
    I think it important to understand WHY it can't be done rather than just know that it can't be done.

    Each browser has its own "default" stylesheet, it is the first thing that gets overridden ; The order is something like:
    linked style sheets, <style> , user specific style, inline CSS. Maybe I got those last two backwards but what I am trying to point out is that you aren't really writing over some "hardwired" values. Once you start declaring values you are overriding and in a sense creating a new default, since you can never know the ACTUAL ORIGINAL values set by the UA or the USER anyway.

    If you are trying to override someone else's code (for shame!!) first keep in mind code order. LAST IMPORTED style sheet will beat out the PREVIOUS ONES, so make the link to your code LAST. EMBEDDED CSS beats out LINKED external style sheets, but this may not be something you want to do if you are essentially trying to recode most of the rules, and doing so on every page of your site!


    I think its was the suggestion above.. but again I will distill the concept.

    Add more specificity ( ! important will do this.. but it could lead to some serious side effects). So, I would recommend you look at the markup you are trying to style, are you targeting the children of a specific area/class/ID??

    So for example and code all YOUR CSS ( the rules you are trying to change) with BODY (the rest of the selectors you are trying to beat as they appear on their code) {the rules you are overriding} it should do the trick.


    example:
    .theirClass p{ color: red; }/* the old rule*/
    body .theirClass p{ color: pink; }/* your rule.*/


    Hope that makes sense to you.


Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •