Float: izquierda basada en el diseño CSS responsive-Floaty. CSS

Vista prévia

Descripción

La biblioteca Floaty. CSS ayuda a los desarrolladores web a crear un diseño adaptable entre exploradores basado en la propiedad de CSS float: Left.

Funcionamiento

Instale & descargar el paquete a través de NPM.

# NPM
$ npm install floatycss --save

Importa el Floaty. CSS en el documento.

<link rel="stylesheet" href="floaty.css">

O de la CDN.

<link rel="stylesheet" href="https://unpkg.com/floatycss/floaty.css">

Crear elementos de diseño en la Página Web.

<div class="p100"><h1>Floaty CSS Layout Demo</div>

<div class="p50">50%</div>
<div class="p50">50%</div>

<div class="p33">33,3%</div>
<div class="p33">33,3%</div>
<div class="p33">33,3%</div>

<div class="p25">25%</div>
<div class="p25">25%</div>
<div class="p25">25%</div>
<div class="p25">25%</div>

<div class="p20">20%</div>
<div class="p20">20%</div>
<div class="p20">20%</div>
<div class="p20">20%</div>
<div class="p20">20%</div>

<div class="p17">16,66%</div>
<div class="p17">16,66%</div>
<div class="p17">16,66%</div>
<div class="p17">16,66%</div>
<div class="p17">16,66%</div>
<div class="p17">16,66%</div>


<div class="p12">12,5%</div>
<div class="p12">12,5%</div>
<div class="p12">12,5%</div>
<div class="p12">12,5%</div>
<div class="p12">12,5%</div>
<div class="p12">12,5%</div>
<div class="p12">12,5%</div>
<div class="p12">12,5%</div>


<div class="p17">17%</div>
<div class="p83">83%</div>


<div class="p50">50%</div>
<div class="p25">25%</div>
<div class="p25">25%</div>