tor-browser

The Tor Browser
git clone https://git.dasho.dev/tor-browser.git
Log | Files | Refs | README | LICENSE

float-applies-to-001a.xht (1740B)


      1 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
      2 
      3 <html xmlns="http://www.w3.org/1999/xhtml">
      4 
      5  <head>
      6 
      7   <title>CSS Test: Float applied to element with 'display' set to 'table-row-group'</title>
      8 
      9   <link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" />
     10   <link rel="help" href="http://www.w3.org/TR/CSS21/visuren.html#dis-pos-flo" title="9.7 Relationships between 'display', 'position', and 'float' "/>
     11   <link rel="help" href="http://www.w3.org/TR/CSS21/visuren.html#float-position" title="9.5.1 Positioning the float: the 'float' property" />
     12   <link rel="match" href="../reference/float-applies-to-001-ref.xht" />
     13 
     14   <meta name="assert" content="If 'float' has a value other than 'none' and is applied to an element with a specified 'display' value of 'table-row-group', then the box is floated and its computed 'display' value is set to 'block'." />
     15 
     16   <style type="text/css"><![CDATA[
     17   div#table
     18   {
     19   display: table;
     20   table-layout: fixed;
     21   width: 100%;
     22   }
     23 
     24   div#table-row-group
     25   {
     26   background-color: blue;
     27   display: table-row-group;
     28   float: right;
     29   height: 1in;
     30   width: 1in;
     31   }
     32 
     33   div.row {display: table-row;}
     34 
     35   div.cell
     36   {
     37   color: blue;
     38   display: table-cell;
     39   }
     40   ]]></style>
     41 
     42  </head>
     43 
     44  <body>
     45 
     46   <p>Test passes if there is a filled blue square on the right side of the page.</p>
     47 
     48   <div id="table">
     49 
     50       <div id="table-row-group">
     51 
     52           <div class="row">
     53               <div class="cell">a</div><div class="cell">b</div>
     54           </div>
     55 
     56           <div class="row">
     57               <div class="cell">c</div><div class="cell">d</div>
     58           </div>
     59 
     60      </div>
     61 
     62   </div>
     63 
     64  </body>
     65 </html>