<p dir="auto">I think that the size of modal-lg should be smaller for xs and sm devices, so that sizing the modal with hidden- and visible- should not ne necessary fit the modals onto the devices.</p>
<p dir="auto">First I want to give a example of why this could be useful in my eyes. Reason for having these classes is allowing you to float elements when the screen is large enough and place them precisely when the screen gets smaller. A list of tags for example look nicer when floated on a big screen:</p>
<div class="snippet-clipboard-content notranslate position-relative overflow-auto" data-snippet-clipboard-copy-content="|[tag1] [longtagname] [tag3] [tag4] [tag5andsomemore]                              |"><pre class="notranslate"><code class="notranslate">|[tag1] [longtagname] [tag3] [tag4] [tag5andsomemore]                              |
</code></pre></div>
<p dir="auto">But on a small screen it looks kind of messy:</p>
<div class="snippet-clipboard-content notranslate position-relative overflow-auto" data-snippet-clipboard-copy-content="|-----------------|
|[tag1]           |
|-----------------|
|[longtagname]    |
|-----------------|
|[tag3] [tag4]    |
|-----------------|
|[tag5andsomemore]|
|-----------------|"><pre class="notranslate"><code class="notranslate">|-----------------|
|[tag1]           |
|-----------------|
|[longtagname]    |
|-----------------|
|[tag3] [tag4]    |
|-----------------|
|[tag5andsomemore]|
|-----------------|
</code></pre></div>
<p dir="auto">With the suggested styles we can make it look nice and structured:</p>
<div class="snippet-clipboard-content notranslate position-relative overflow-auto" data-snippet-clipboard-copy-content="|-----------------|
|[ tag1  ][longt-]|
|[       ][agname]|
|-----------------|
|[ tag3  ][ tag4 ]|
|-----------------|
|[tag5an-]        |
|[somemo-]        |
|[  re   ]        |
|-----------------|"><pre class="notranslate"><code class="notranslate">|-----------------|
|[ tag1  ][longt-]|
|[       ][agname]|
|-----------------|
|[ tag3  ][ tag4 ]|
|-----------------|
|[tag5an-]        |
|[somemo-]        |
|[  re   ]        |
|-----------------|
</code></pre></div>
<p dir="auto">Well it still looks crappy in ASCII but I hope you get the point. The HTML would look something like this:</p>
<div class="snippet-clipboard-content notranslate position-relative overflow-auto" data-snippet-clipboard-copy-content="&lt;div class=&quot;row-mdi&quot;&gt;
    &lt;div class=&quot;my-tag-style col-mdi-3 col-smi-6&quot;&gt;
        tag1
    &lt;/div&gt;
    &lt;div class=&quot;my-tag-style col-mdi-3 col-smi-6&quot;&gt;
        longtagname
    &lt;/div&gt;
    ...
&lt;/div&gt;"><pre class="notranslate"><code class="notranslate">&lt;div class="row-mdi"&gt;
    &lt;div class="my-tag-style col-mdi-3 col-smi-6"&gt;
        tag1
    &lt;/div&gt;
    &lt;div class="my-tag-style col-mdi-3 col-smi-6"&gt;
        longtagname
    &lt;/div&gt;
    ...
&lt;/div&gt;
</code></pre></div>
<p dir="auto">As you might have noticed in the code above, the downside is that we need a conditional row class as well.</p>
<p dir="auto">I have a piece of code that implements this but it is written in terms of the old grid code that didn't use mixins for most of the styles.</p>
<p dir="auto">Before converting the code and submitting a pull request I wanted to get some critique. I can imagine that one might say that these styles are not general-purpose enough, so to speak, to be included in twbs.</p>