#1
  1. No Profile Picture
    Registered User
    Devshed Newbie (0 - 499 posts)

    Join Date
    Jan 2013
    Posts
    6
    Rep Power
    0

    Using Inverse Percentages


    Is it possible to use inverse percentage in padding? For example, I have the following structure:

    <div class="parent">
    <div class="child">
    </div>
    </div>

    The CSS is:

    .parent {
    width: 300px;
    height:300px;
    }

    So can I use something like:

    .parent .child {
    width: 90px;
    height: 20000/height-of-parent-in-percentage
    }

    That way, as the height of the parent increases, the padding of the child decreases. So is something like this possible?
  2. #2
  3. For POny!
    Devshed Newbie (0 - 499 posts)

    Join Date
    Apr 2012
    Location
    Amsterdam
    Posts
    416
    Rep Power
    115
    not in css. (as far as I am aware of)

    You can with javascript
  4. #3
  5. CSS & JS/DOM Adept
    Devshed Supreme Being (6500+ posts)

    Join Date
    Jul 2004
    Location
    USA (verifiably)
    Posts
    20,131
    Rep Power
    4304
    Welcome to DevShed Forums, prachikhadke.

    Actually CSS3 introduces the "calc()" functional notation, which may allow you do such a calculation. Safari 5.x and Opera don't support it, but other major browsers do, including Safari 6 and IE9 and newer (if you use the "-webkit-" and "-moz-" prefixed variants). IE5-7 support "expression()" which provides a similar ability, however, note that support for neither "calc()" nor "expression()" is available in IE8's standards mode.

    https://developer.mozilla.org/en-US/docs/CSS/calc
    http://www.w3.org/TR/css3-values/#calc-notation
    http://caniuse.com/calc
    Spreading knowledge, one newbie at a time.

    Check out my blog. | Learn CSS. | PHP includes | X/HTML Validator | CSS validator | Common CSS Mistakes | Common JS Mistakes

    Remember people spend most of their time on other people's sites (so don't violate web design conventions).

IMN logo majestic logo threadwatch logo seochat tools logo