WAI Website Assets

Boxes: Float Right Small 

<aside class="box box-simple box-right box-aside">
    <header class="box-h box-h-simple">More info
    </header>
    <div class="box-i">
        <p>When you want to learn more about how different disabilities affect Web use, and read about scenarios of people with disabilities using the Web, see <a href="#">How People with Disabilities Use the Web</a>.</p>
    </div>
</aside>
 
<aside class="box{% for mod in mods %} box-{{ mod }}{% endfor %}">
  {%render '@box-header', type=headertype, label=headerlabel, mods=headermods, icon=headericon %}
  <div class="box-i">
    {%- if content == "linklist" -%}
    {%- render '@list-links' -%}
    {%- elseif content == "listwithlinks" -%}
    {%- render '@list-unordered-with-link' -%}
    {%- elseif content == "help-box-content" -%}
    {%- render '@box-help-content' -%}
    {%- else -%}
    {{content}}
    {%- endif -%}
  </div>
</aside>
 
{
  "headerlabel": "More info",
  "headertype": "simple",
  "headermods": [
    "simple"
  ],
  "mods": [
    "simple",
    "right",
    "aside"
  ],
  "content": "<p>When you want to learn more about how different disabilities affect Web use, and read about scenarios of people with disabilities using the Web, see <a href=\"#\">How People with Disabilities Use the Web</a>.</p>"
}

There are no notes for this item.