Enlaces desde gobierno
1 columna
Responsividad
Se adapta al ancho disponible ocupando el 100%.
En resoluciones menores de 360px la imagen del bullet desaparece y un cuadro rojo, más pequeño, aparece en su lugar.
Código
<div class="texto borde gobierno">
<h2>[ENCABEZADO]</h2>
<ul>
<li>
<a href="[ENLACE]">[TITULO]</a>
</li>
[...]
</ul>
</div>
2 columnas
Responsividad
El componente se coloca en una fila de dos columnas a partir de 600px, por debajo de 600px se coloca en dos filas de una columna.
En resoluciones menores de 360px la imagen del bullet desaparece y un cuadro rojo, más pequeño, aparece en su lugar.
Código
<div class="fila col-2">
<div class="texto borde gobierno">
<h2>[ENCABEZADO]</h2>
<ul>
<li>
<a href="[ENLACE]">[TÍTULO]</a>
</li>
[...]
</ul>
</div>
<div class="texto borde gobierno">
<h2>[ENCABEZADO]</h2>
<ul>
<li>
<a href="[ENLACE]">[TÍTULO]</a>
</li>
[...]
</ul>
</div>
</div>
3 columnas
Responsividad
El componente se coloca en una fila de tres columnas a partir de 768px, por debajo de 768px se coloca en tres filas de una columna.
En resoluciones menores de 360px la imagen del bullet desaparece y un cuadro rojo, más pequeño, aparece en su lugar.
Código
<div class="fila col-3">
<div class="texto borde gobierno">
<h2>[ENCABEZADO]</h2>
<ul>
<li>
<a href="[ENLACE]">[TÍTULO]</a>
</li>
[...]
</ul>
</div>
<div class="texto borde gobierno">
<h2>[ENCABEZADO]</h2>
<ul>
<li>
<a href="[ENLACE]">[TÍTULO]</a>
</li>
[...]
</ul>
</div>
<div class="texto borde gobierno">
<h2>[ENCABEZADO]</h2>
<ul>
<li>
<a href="[ENLACE]">[TÍTULO]</a>
</li>
[...]
</ul>
</div>
</div>