Liens en vrac

#container {
   max-height: 100%;
}

#container img {
   /* Keeps image from going outside the screen */
   max-height: 100%;
   max-width: 100%;
   /* Keeps image from beeing distorted */
   height: auto;
   width: auto;
   /* centering horizontally AND vertically */
   /* 50% of container */
   position: relative;
   top: 50%;
   left: 50%;
   /* 50% of image */
   transform: translate(-50%,-50%);
}

Comment transformer un tableau en un tableau responsive lisible sur des petits écrans

@media (max-width: 500px) {
/* table + tbody are blocks */
#mytable, #mytable tbody {
display: block;
width: 100%;
}

/* each row becomes table */
#mytable tr {
display: table;
margin-top: 20px;
width: 100%;
border-spacing: 5px 0;
}

/* each cell becomes a row (of the row that had become a table)  */
#mytable tr td {
display: table-row;
width: 100%;
}
}

Comment faire des triangles sans image avec un peu de CSS.

Centrer en CSS, c’est la base, et parfois, ce n’est pas si simple. Ce guide liste les techniques les plus connues pour réaliser cet effet centré.