Bootstrap

http://getbootstrap.com/getting-started/

w3school-Tutorial/Referenz

http://getbootstrap.com/css/

Immer erst .container (full width mit .container-fluid), dann div .row, dann die Spalten. Diese müssen zusammen immer 12 ergeben.

• xs x-small (for phones)
• sm small (for tablets)
• md middle (for desktops)
• lg large (for larger desktops)

also: col-[size]-[anzahl von 12]

<div class="container">
  <div class="row">
    <div class="col-*-*"></div>
  </div>
  <div class="row">
    <div class="col-*-*"></div>
    <div class="col-*-*"></div>
    <div class="col-*-*"></div>
  </div>
  <div class="row">
    ...
  </div>
</div>

Clear floats (with the .clearfix class) at specific breakpoints to prevent strange wrapping with uneven content:

  <!-- Add clearfix for only the required viewport -->
  <div class="clearfix visible-xs"></div>

class

pull-right

https://v4-alpha.getbootstrap.com/components/list-group/

https://v4-alpha.getbootstrap.com/content/typography/

Add a <footer class=„blockquote-footer“> for identifying the source. Wrap the name of the source work in <cite> .

<blockquote class="blockquote">
  <p class="mb-0">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer posuere erat a ante.</p>
  <footer class="blockquote-footer">Someone famous in <cite title="Source Title">Source Title</cite></footer>
</blockquote>

Add .blockquote-reverse for a blockquote with right-aligned content.

<blockquote class="blockquote blockquote-reverse">
  <p class="mb-0">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer posuere erat a ante.</p>
  <footer class="blockquote-footer">Someone famous in <cite title="Source Title">Source Title</cite></footer>
</blockquote>