<commit_before><!DOCTYPE html>
<meta charset="utf-8">
<title>Size [utility] - SUIT CSS</title>
<meta name="viewport" content="initial-scale=1, width=device-width">
<link rel="stylesheet" href="../build/test.css">
<style>
  .u-cf:after {
    clear: both;
    content:"";
    display: table;
  }

  .u-highlight {
    background: #ff0;
    margin: 0 0 10px;
  }

  .dev-Box {
    background: red;
    height: 50px;
    width: 50px;
  }
</style>

<div class="Test">
  <h1 class="Test-title">SUIT CSS: <a href="https://github.com/suitcss/utils-size">sizing utility</a> tests</h1>

  <h2 class="Test-describe">.u-sizeFit / .u-sizeFill</h2>
  <h3 class="Test-it">shrink-wraps (on left) / fills remaining space</h3>
  <div class="Test-run">
    <div class="u-cf">
      <div class="u-sizeFit">
        <div class="dev-Box"></div>
      </div>
      <div class="u-sizeFill u-highlight">
        content
      </div>
    </div>
  </div>

  <h2 class="Test-describe">.u-sizeFit / .u-sizeFillAlt</h2>
  <h3 class="Test-it">shrink-wraps (on left) / fills remaining space</h3>
  <div class="Test-run">
    <div class="u-cf">
      <div class="u-sizeFit">
        <div class="dev-Box"></div>
      </div>
      <div class="u-sizeFillAlt u-highlight">
        content
      </div>
    </div>
  </div>

  <h2 class="Test-describe">.u-sizeFitAlt / .u-sizeFill</h2>
  <h3 class="Test-it">shrink-wraps (on right) / fills remaining space</h3>
  <div class="Test-run">
    <div class="u-cf">
      <div class="u-sizeFitAlt">
        <div class="dev-Box"></div>
      </div>
      <div class="u-sizeFill u-highlight">
        content
      </div>
    </div>
  </div>

  <h2 class="Test-describe">.u-sizeFull</h2>
  <h3 class="Test-it">fits the full-width of the container</h3>
  <div class="Test-run">
    <div class="u-sizeFull u-highlight" style="border:10px solid red;">
      content
    </div>
  </div>

  <h2 class="Test-describe">.u-sizeXof2</h2>
  <h3 class="Test-it">sizes to 1/2 of the parent container</h3>
  <div class="Test-run">
    <div class="u-size1of2 u-highlight">1of2</div>
  </div>

  <h2 class="Test-describe">.u-sizeXof3</h2>
  <h3 class="Test-it">sizes to 1/3 of the parent container</h3>
  <div class="Test-run"><commit_msg>Remove unused text fixtures<commit_after><!DOCTYPE html>
<meta charset="utf-8">
<title>Size [utility] - SUIT CSS</title>
<meta name="viewport" content="initial-scale=1, width=device-width">
<link rel="stylesheet" href="../build/test.css">
<style>
  .u-cf:after {
    clear: both;
    content:"";
    display: table;
  }

  .u-highlight {
    background: #ff0;
    margin: 0 0 10px;
  }

  .dev-Box {
    background: red;
    height: 50px;
    width: 50px;
  }
</style>

<div class="Test">
  <h1 class="Test-title">SUIT CSS: <a href="https://github.com/suitcss/utils-size">sizing utility</a> tests</h1>

  <h2 class="Test-describe">.u-sizeXof2</h2>
  <h3 class="Test-it">sizes to 1/2 of the parent container</h3>
  <div class="Test-run">
    <div class="u-size1of2 u-highlight">1of2</div>
  </div>

  <h2 class="Test-describe">.u-sizeXof3</h2>
  <h3 class="Test-it">sizes to 1/3 of the parent container</h3>
  <div class="Test-run">
{'fraction_non_alphanumeric': 0.19759341355288157, 'fraction_numerical': 0.0253324889170361, 'mean_word_length': 3.102597402597403, 'pattern_counts': {'":': 0, '<': 105, '<?xml version=': 0, '>': 105, 'https://': 2, 'lorem ipsum': 0, 'www.': 0, 'xml': 0}, 'pii_count': 0, 'substrings_counts': 0, 'word_list_counts': {'cursed_substrings.json': 0, 'profanity_word_list.json': 0, 'sexual_word_list.json': 0, 'zh_pornsignals.json': 0}}
{'dir': 'git-commits-cleaned', 'id': '4105525', 'n_tokens_mistral': 1288, 'n_tokens_neox': 1220, 'n_words': 248}