How to substract margin or padding from 100% width?

Discussion in 'Website Development & Design' started by bmwillsmith, Jul 19, 2014.

  1. bmwillsmith

    bmwillsmith
    uix_expand uix_collapse
    Member

    Joined:
    Jan 23, 2014
    Messages:
    380
    Likes Received:
    10
    Friends, some times we will face different types of Cascaded Style Sheet (C.S.S) issues. Especially when we are dealing width in 100% ratio.
    In this case we can not expect the exact margin, padding or edges. This may happen when we are working for a large website with complex classes and heavy coding.
    In this time also we can overcome this width 100% problem. The below shown code is the simple example:

    Here calc funtion is helping us like a calculator which will add or subtract two units.
    Don't worry about cross browser compatibility. It can support all latest browsers, Internet Explorer 9+, Chrome, Mozilla any latest version. It can supports iOs also.

    Now we will see even more examples:

    Predicting with in the above like percentages is quite tough task, surely you agree with me right? Okay, here we have a simple solution using C S S calc function.

    Using width calc property is very simple and fast.
     
  2. RoseAb

    RoseAb
    uix_expand uix_collapse
    Member

    Joined:
    Dec 7, 2013
    Messages:
    87
    Likes Received:
    10
    Thanks for this information. I didn't know there was a calc for CSS.
    I'm not working on that part of my website right now but someday this will be handy to know about.
     
  3. bmwillsmith

    bmwillsmith
    uix_expand uix_collapse
    Member

    Joined:
    Jan 23, 2014
    Messages:
    380
    Likes Received:
    10
    ya this is something new I have shared.
    In future I will add more useful web design things.
    And we need to remember that this calc is not working in android phones.
     
  4. AJKpeter

    AJKpeter
    uix_expand uix_collapse
    Member

    Joined:
    Nov 14, 2011
    Messages:
    390
    Likes Received:
    7
    So what is working in android OS?
     

Share This Page