Staff en línea

[html]Tablilla sencilla
Tema iniciado por y Añadir a favoritos

[html]Tablilla sencilla 
el Vie Dic 15, 2017 12:56 pm
staff
[codebox]Tablilla para añadir en la plantilla. Si necesitas ayuda, consulta aquí mismo[/codebox]
DEMO
http://www.opensourcephpbb3.com/h35-tablilla2-0-aporte-rinc

HTML
[hidecode]
Código:
<div class="wrapper">
  <header class="header">My header</header>
  <aside class="sidebar">Sidebar</aside>
  <article class="content">
    <h1>2 column, header and footer</h1>
    <p>This example uses line-based positioning, to position the header and footer, stretching them across the grid.</p>
  </article>
  <footer class="footer">My footer</footer>
</div>
[/hidecode]


CSS
[hidecode]
Código:
.sidebar {
  float: left;
  width: 19.1489%;
}

.content {
  float: right;
  width: 79.7872%;
}

/* make a grid */
.wrapper {
  max-width: 940px;
  margin: 0 auto;
  display: grid;
  grid-template-columns: 1fr 3fr;
  grid-gap: 10px;
}

.wrapper > * {
  background-color: #444;
  color: #fff;
  border-radius: 5px;
  padding: 20px;
  font-size: 150%;
  /* needed for the floated layout*/
  margin-bottom: 10px;
}

.header,
.footer {
  grid-column: 1 / -1;
  /* needed for the floated layout */
  clear: both;
}

/* We need to set the widths used on floated items back to auto, and remove the bottom margin as when we have grid we have gaps. */
@supports (display: grid) {
  .wrapper > * {
    width: auto;
    margin: 0;
  }
}
[/hidecode]

El código contiene balizas genéricas, por lo que al añadir el CSS puede cambiar más cosas del foro por tener el mismo nombre. Deberás cambiarlo por nombres únicos de la tablilla para que no afecte al resto del foro.
RinC
avatar

¿Que estoy pensando? :

Ni se te ocurra -_- [table class=fecha_up][td]Se modifico:29/03/18 - 17:44 hrs. [/td][/table]


Banner en temas :

♥♥Open♥♥


Color de titulos :

#DF7401


Sombra titulo :

1px 1px 1px #fff


Mensajes :

789


Puntos :

1147


Me gusta :

198


ingreso :

28/01/2015


Sexo :

Femenino

Plataforma :

PhpBB3


Navegador :

Chrome


Ver perfil de usuario

Volver arriba Ir abajo

 En la misma categoria


Permisos de este foro:
No puedes responder a temas en este foro.