100% width div with padding - HTML CSS CSS Layout

HTML CSS examples for CSS Layout:Width

  1. HOME
  2. HTML CSS
  3. CSS Layout
  4. Width

Description

100% width div with padding

Demo Code

ResultView the demo in separate window 

<html>
   <head> 
      <style type="text/css">
.red-box {background:red;width:100%}
.red-box .inner {padding:10px}
.blue-box {background:blue;box-sizing:border-box;width:100%;padding:10px}

      </style> 
   </head> 
   <body> 
      <div class="red-box"> 
         <div class="inner">
             This is one way to tackle the problem 
         </div> 
      </div> 
      <div class="blue-box">
          This is another <!--   w ww. j  av  a2s.  c  om-->
      </div>  
   </body>
</html>

Related Tutorials