Exposition picker list style test

exposition.html

@@ -28,7 +28,22 @@
     </header>
 
     <article>
-        <h1>Exposition</h1>
+        <div id="expo-top">
+            <span class="support">Support :
+                <select name="type">
+                    <option selected="yes">Tableaux</option>
+                    <option>Aquarelle</option>
+                    <option>Soie</option>
+                    <option>Divers</option>
+                </select>
+            </span>
+        
+            <h1>Exposition</h1>
+            
+            <span class="pagination">
+                <span>&larr;</span> Page 3 sur 6 <span>&rarr;</span>
+            </span>
+        </div>
 
         <div id="gallery">
             <a data-fancybox="exposition" href="images/paintings/normal/15.jpg" data-fancybox-index="15">

styles/main.css

@@ -96,6 +96,45 @@ article.main p.signature {
 
 /* Exposition */
 
+article #expo-top {
+    display:flex;
+    flex-direction:row;
+    justify-content:space-between;
+    align-self: flex-end;
+    align-content: space-between;
+    flex-wrap: wrap;
+
+    position:relative;
+    display:block;
+    margin:0;
+    margin-bottom:1.5rem;
+}
+
+article #expo-top h1 {
+    margin:0;
+}
+
+article #expo-top .support {
+    bottom:0;
+    display:block;
+    position:absolute;
+    margin-left:6rem;
+}
+
+article #expo-top .pagination {
+    bottom:0;
+    display:block;
+    position:absolute;
+
+    right:6rem;
+    margin-left:0;
+}
+
+article #expo-top span span {
+    display:initial;
+    font-size:1.5rem;
+}
+
 article #gallery {
     display:inline-block;
     position:relative;