Article à plusieurs colonnes

Le site utilise le framework Bootstrap

Il est donc possible d’utiliser la mise à page en colonnes
https://getbootstrap.com/docs/4.2/layout/grid/

A utiliser avec précaution :
  • tester votre mise en page sur les mobiles et petits terminaux.
  • si vous oubliez de fermer une balise, toute la mise en page peut sauter.

Article sur 2 colonnes

<div class="row">
 <div class="col">
     1 of 2
  </div>
  <div class="col">
     2 of 2
  </div>
</div>

Démonstration

Lorem ipsum dolor sit amet consectetuer interdum eget nibh et amet. Arcu lobortis mauris malesuada consequat et Maecenas mauris leo augue vitae. Tempor ultrices amet quis faucibus risus interdum Donec nibh cursus nibh. Sed Nam turpis nec Pellentesque eget facilisi lacinia eget dolor et. Lobortis nisl porta et sem laoreet Vestibulum risus Phasellus et et. Justo tempor sollicitudin consectetuer congue augue nec sem mauris hac Curabitur. Ultrices quis turpis mi pretium id quis magnis tellus Cras vel. Sed Sed non ac nascetur eget gravida ligula pellentesque ut id. Et Lorem In Nunc nascetur justo et facilisi nibh massa velit. Auctor eu velit vitae metus convallis libero lacus interdum hendrerit gravida. Ipsum nec felis laoreet est consectetuer tellus augue sem risus mattis. Integer Curabitur vitae ut dolor quis Sed congue Lorem Nam tempus. Tincidunt accumsan Vivamus dui Morbi eget netus sagittis sem vel Integer. Convallis in elit id Nulla Phasellus lorem egestas senectus elit dictumst. Vitae Vivamus Nunc at euismod dis urna lacus Pellentesque mus eu. Maecenas non vitae ligula convallis odio dui ridiculus elit est tincidunt. Sed in Integer habitasse tellus pellentesque et volutpat enim sed et. Id tellus wisi semper non Nulla Cum pede Mauris Donec Curabitur. Curabitur est dui congue Nullam orci condimentum eu Phasellus hendrerit Sed. Malesuada nascetur est interdum Phasellus risus nunc nibh iaculis ut pede. Vitae sociis magna et justo lorem Sed pretium odio dolor ac. Lacus
Sem elit condimentum ultrices ipsum sem malesuada elit adipiscing pellentesque Curabitur. Massa pretium malesuada vel In risus semper convallis leo Aenean magnis. At urna rhoncus condimentum interdum neque eget purus consectetuer eget ac. Mauris Nam convallis fringilla volutpat Lorem nulla ante consectetuer tempor consectetuer. Sagittis tellus eget et dis felis volutpat pellentesque cursus tristique tincidunt. Vel rutrum Nunc Integer dolor odio orci Sed dapibus consequat a. Augue id Phasellus id sit elit pretium at Nam ullamcorper Curabitur. Ut id In at condimentum et Vestibulum et lorem elit tempus. Tempor Curabitur ullamcorper metus elit Nullam Suspendisse consequat eget elit non. Vestibulum interdum ligula dui Cras Vestibulum Mauris mollis adipiscing semper ut. Vestibulum nunc odio condimentum hendrerit mollis hac mus elit Aenean feugiat. Mauris et tincidunt facilisis in elit at In dui semper magnis. Vel Vestibulum lorem Integer adipiscing neque eget auctor nulla consequat ligula. Phasellus Integer quis tristique ligula ipsum vel Curabitur orci et Curabitur. Nulla tempor sagittis tempus purus vitae parturient Integer adipiscing eget congue. Nibh laoreet vel Phasellus odio sollicitudin non wisi Vestibulum ut sagittis. Mollis dictumst velit In libero Curabitur dolor ante elit Sed ante. Eros vitae at pede nec justo sapien Mauris sed auctor sem. Integer ornare Vivamus eget Vivamus tincidunt morbi interdum neque velit vitae. Urna lobortis felis ligula dictum in Curabitur arcu semper dolor facilisis. Pretium Nullam sed netus habitant tempor Sed elit malesuada ante

Article sur 3 colonnes

<div class="row">
 <div class="col">
     1 of 3
  </div>
  <div class="col">
     2 of 3
  </div>
  <div class="col">
     3 of 3
  </div>
</div>

Démonstration

Dictumst turpis auctor volutpat odio Fusce et at amet et lobortis. Felis ut mauris et mi consectetuer tempor Phasellus id Nulla dui. Dui Proin laoreet id orci ligula ac tincidunt vitae congue auctor. At Donec orci nunc vitae Sed at semper facilisis sem non. Curabitur Vivamus sagittis pellentesque nec vitae fringilla lobortis ac volutpat nec. Sed wisi Phasellus sit lacinia consectetuer sociis ligula morbi at quis. Amet sagittis volutpat Curabitur eui
nec justo risus fringilla tincidunt mauris. Quisque et sed pulvinar quis convallis ridiculus convallis at habitant consequat. Cum vel justo Vivamus netus tellus Vivamus vel Fusce nunc Cum. Id pellentesque semper pede feugiat consequat natoque Nulla senectus urna urna. Dictumst turpis auctor volutpat odio Fusce et at amet et lobortis. Felis ut mauris et mi consectetuer tempor Phasellus id Nulla dui. Dui Proin laoreet id orci ligula ac tincidunt vitae congue auctor. At Donec orci nunc vitae Sed at semper facilisis sem non. Curabitur Vivamus sagittis pellentesque nec vitae fringilla lobortis ac volutpat nec. Sed wisi Phasellus sit lacinia consectetuer sociis ligula morbi at quis. Amet sagittis volutpat Curabitur eui
Adipiscing condimentum orci Proin consectetuer orci purus Nam porta vitae Donec. Convallis justo semper Vestibulum consequat Curabitur at dolor orci quis Sed. A lobortis quis Aenean orci sociis adipiscing Morbi orci hac interdum. Sodales Quisque Vestibulum interdum ullamcorper ipsum id ante porta Curabitur egestas. Sed In convallis Pellentesque auctor eros ac amet orci ut pellentesque. Et laoreet in vitae id Aenean Phasellus dui convallis Curabitur Nulla. Laoreet sem auctor Sed wisi mauris Curabitur magna tempus et elit. Vitae sagittis sed vitae pretium nisl ac metus eget pretium In. Aliquet congue tincidunt et velit eget nec sollicitudin eget neque In. Eget Nam et vitae gravida Pellentesque dui dui egestas adipiscing orci. Justo convallis malesuada Fusce condimentum interdum tincidunt id eu est Vestibulum. Pellentesque interdum ut tincidunt volutpat orci vel Ut sed eget quis. Pellentesque Sed Phasellus semper Quisque pellentesque congue nec risus vitae leo. Diam justo orci nibh laoreet smod dictum Nullam pharetra condimentum vestibulum Aenean. Nulla Morbi laoreet sed risus eu tortor laoreet at tortor Curabitur. Et ligula et dictumst tellus dictum Nullam elit eget pede Sed. Consequat pretium adipiscing Vivamus condimentum Nam mi est Nulla lacus congue. Aenean lacinia at ac id et malesuada elit Donec convallis morbi. Quis Nam Sed arcu tempor leo fermentum gravida faucibus felis nonummy. Fringilla id sed nibh ut augue et Nam hac adipiscing quis. Mauris metus vitae lacinia justo odio vitae odio sagittis vitae vitae. Quis ut euismod porttitor nec tincidunt urna suscipit ligula volutpat Curabitur. Lacus elit eget massa adipiscing Pellentesque tellus risus pretium tortor Nulla. Nulla dui laoreet est tincidunt sed amet dolor rutrum pellentesque volutpat. Fermentum dui egestas commodo pretium ultrices tristique augue sapien nec aliquam. Semper pellentesque hac sed quis id nisl.