phvaillant

<div class="row">
    <div class="col-xs-8 blue">
        col-xs-8
    </div>
    <div class="col-xs-4 red">
        col-xs-4
    </div>
</div>

phvaillant

<ods-dataset-context context="nobelprizelaureates" nobelprizelaureates-dataset="nobel-prize-laureates" nobelprizelaureates-domain="public">
    <div class="row">
        <div class="col-xs-12">
            <div class="ods-box">
                <!-- PART COPY PASTED WITH THE ODS-DATASET-CONTEXT MOVED ABOVE
                <ods-map no-refit="true" scroll-wheel-zoom="false" toolbar-fullscreen="true" basemap="jawg.streets" location="2,37.85751,-1.75781">
                    <ods-map-layer-group>
                        <ods-map-layer context="nobelprizelaureates" color-numeric-ranges="{'2':'#CDBCD9','10':'#B69BC8','20':'#9F7AB8','50':'#8859A7','100':'#713897','379':'#5A1887'}" color-undefined="#1B5AA5" color-out-of-bounds="#1BA566" color-numeric-range-min="1" picto="ods-circle" show-marker="true" display="choropleth" function="COUNT" expression="id" shape-opacity="0.5" point-opacity="1" border-color="#FFFFFF" border-opacity="1" border-size="1" border-pattern="solid" caption="true" title="Nobel Prize - Laureates" 

phvaillant

.blue {
    background-color: lightblue;
    height: 100px;
}

.green {
    background-color: lightgreen;
    height: 50px;
}

phvaillant

<div class="row">
    <div class="col-xs-6 blue">
        1
    </div>
    <div class="col-xs-6">
        <div class="row">
            <div class="col-xs-3 green">
                2a
            </div>
            <div class="col-xs-9 orange">

phvaillant

<div class="row">
    <div class="col-xs-3 red">
        First element on the first line
    </div>
    <div class="col-xs-4 blue">
        Second element on the first line
    </div>
</div>
<div class="row">
    <div class="col-xs-2 blue">

phvaillant

.red {
    background-color: salmon;
    height: 100px;
}

.blue {
    background-color: lightblue;
    height: 100px;
}

phvaillant

<div class="row">
   <div class="col-xs-1 blue">
      Column 1
   </div>
   <div class="col-xs-1 red">
      Column 2
   </div>
   <div class="col-xs-1 blue">
      Column 3
   </div>

phvaillant

<div class="ods-box halfwidth firstlevel">
  DIV
</div>

<div class="ods-box halfwidth firstlevel">
  
  <div class="ods-box fullwidth secondlevel">
    DIV WITHIN A DIV
  </div>

phvaillant

<div class="ods-box fullwidth  firstlevel">
  <h2>
    BOITE 1 (DIV)
  </h2>
</div>
                
<div class="ods-box halfwidth firstlevel">
  <h2>
    BOITE 2 (DIV)
  </h2>

phvaillant

<h2>
    A title of level 2
</h2>

<ol>
  <li>
      First element
  </li>
  <li>
      Second element