|
ruby rt {
font-size: 65%;
}
/***********************************/
/* Responsive Music Box CSS */
/***********************************/
/* This is an experimental stylesheet used to generate responsive content */
/* Music + BGM Box */
.responsive-width {
float: left;
width: 100%;
height: 100%;
}
/* Flexbox container (list) */
ul.musicbgmbox {
list-style-type: none;
display: flex;
flex-wrap: wrap;
margin: 8px;
padding: 0px;
}
/* Flexbox element (list element) */
/* Contains the Music + BGM Box Template */
ul.musicbgmbox > li{
display: block;
float: left;
flex-basis: 100%;
min-height: 0;
}
/* Responsive resizing based on screen width. */
@media only screen and (min-width: 1200px) {
ul.musicbgmbox > li{
flex-basis: 50%;
}
}
@media only screen and (min-width: 2400px) {
ul.musicbgmbox > li{
flex-basis: 33.33%;
}
}
@media only screen and (min-width: 3600px) {
ul.musicbgmbox > li{
flex-basis: 25%;
}
}
|