third_party/WebKit/LayoutTests/fast/block/basic/015.html

   1 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0//EN" "http://www.w3.org/TR/REC-html40/strict.dtd">
   2 <html>
   3 <head>
   4 <title>Minimum and Maximum Widths</title>
   5 <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
   6 <meta http-equiv="Content-Style-Type" content="text/css">
   7 <link rel="copyright" href="/~dbaron/legal.html">
   8 <style type="text/css">
   9 .test {
  10         border: medium solid purple;
  11         padding: 0;
  12         margin: 0;
  13         }
  14
  15 .one {
  16         width: 40%;
  17         }
  18
  19 .two {
  20         width: 30%;
  21         min-width: 40%;
  22         max-width: 30%;
  23         }
  24
  25 .three {
  26         width: 50%;
  27         min-width: 40%;
  28         max-width: 30%;
  29         }
  30
  31 .four {
  32         width: 50%;
  33         max-width: 40%;
  34         }
  35
  36 .five {
  37         max-width: 60%;
  38         width: 40%;
  39         }
  40
  41 .six {
  42         width: 30%;
  43         min-width: 40%;
  44         }
  45
  46 .seven {
  47         min-width: 20%;
  48         width: 40%;
  49         }
  50
  51
  52 .eight {
  53         width: auto;
  54         margin: 0 70% 0 0;
  55         min-width: 40%;
  56         }
  57
  58 .nine {
  59         max-width: 40%;
  60         }
  61
  62 </style>
  63 </head>
  64 <body>
  65
  66 <h1>Minimum and Maximum Widths</h1>
  67
  68 <div class="test">This <code>div</code> should have a medium solid purple
  69 border, as should all the rest.</div>
  70
  71 <div class="test one">This <code>div</code> should have a width of 40%.  This is a reference <code>div</code> and should work as long as <code>width</code> works.</div>
  72
  73 <div class="test two">This <code>div</code> should have a width of 40%.</div>
  74
  75 <div class="test three">This <code>div</code> should have a width of 40%.</div>
  76
  77 <div class="test four">This <code>div</code> should have a width of 40%.</div>
  78
  79 <div class="test five">This <code>div</code> should have a width of 40%.</div>
  80
  81 <div class="test six">This <code>div</code> should have a width of 40%.</div>
  82
  83 <div class="test seven">This <code>div</code> should have a width of 40%.</div>
  84
  85 <div class="test eight">This <code>div</code> should have a width of 40%.</div>
  86
  87 <div class="test nine">This <code>div</code> should have a width of 40%.</div>
  88
  89 <p>If the browser does not support <code>min-width</code> and
  90 <code>max-width</code>, then the widths should be <code>auto</code>,
  91 <code>40%</code>, <code>30%</code>, <code>50%</code>, <code>50%</code>,
  92 <code>40%</code>, <code>30%</code>, <code>40%</code>, <code>auto</code>
  93 (with 70% margin-right), and <code>auto</code>.</p>
  94 </body></html>