CSS Unit Calculations

CSS3 lets you calculate units.

 
<!DOCTYPE HTML> 
<html> 
    <head> 
        <title>Example</title> 
        <style type="text/css"> 
        p { 
            background: grey; 
            color:white; 
            font-size: 20pt; 
            width: calc(80% - 20px); 
        } 
        </style> 
    </head> 
    <body> 
        <a href="http://java2s.com">Visit the website</a> 
        <p>I like <span>HTML</span> and CSS.</p> 
    </body> 
</html>
Click to view the demo
Home 
  HTML CSS Book 
    CSS  

CSS Value:
  1. CSS Colors
  2. CSS Lengths
  3. Absolute units of measurement
  4. Relative units of measurement
  5. Working with Pixels
  6. Working with Percentages
  7. CSS Unit Calculations
  8. Using CSS Angles
  9. Using CSS Times
Related: