Semantic UI: Unterschiedliche Textausrichtung für verschiedene Geräte

Question

Wie kann ich unterschiedliche Ausrichtung für mobile und andere Geräte mit Semantic UI einstellen? Ich möchte Label rechts auf allen Geräten außer Handys ausrichten. Ist das möglich? Oder gibt es eine Problemumgehung?

<table> 
    <tr> 
     <td class="right aligned tablet computer only">Label</td> 
     <td>Value</td> 
    </tr> 
</table> 

Answer 1

Sie können die Variation von Raster und Tabelle verwenden. Im Raster legen Sie fest, welche Zeilen auf dem Handy, Tablet oder Computer angezeigt werden. Jede Gerätezeile enthält eine Tabelle mit bestimmten Ausrichtungen.

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<script src="https://cdnjs.cloudflare.com/ajax/libs/semantic-ui/2.2.13/semantic.js"></script> 
 
<link href="https://cdnjs.cloudflare.com/ajax/libs/semantic-ui/2.2.13/semantic.css" rel="stylesheet"/> 
 

 
<div class="ui container"> 
 
    <div class="ui one column grid"> 
 

 
     <div class="mobile only row"> 
 
     <table class="ui celled table"> 
 
      <tbody> 
 
      <tr class="right aligned"> 
 
       <td>Mobile</td> 
 
       <td>Value mobile</td> 
 
       </tr> 
 
       </tbody> 
 
      </table> 
 
     </div> 
 

 
     <div class="computer only row"> 
 
      <table class="ui celled table"> 
 
      <tbody> 
 
       <tr class="left aligned"> 
 
       <td>Computer</td> 
 
       <td>Value on computer</td> 
 
       </tr> 
 
      </tbody> 
 
      </table> 
 
     </div> 
 
</div> 
 
</div>