In the article we present today we are going to delve into the fascinating world of
Module:Subject bar/styles.css. From its origins to its relevance today, we will immerse ourselves in a tour of all the relevant aspects that make
Module:Subject bar/styles.css a topic of interest to all types of people. We will analyze its impact on society, its evolution over time and the different perspectives that exist on
Module:Subject bar/styles.css. Regardless of your level of prior knowledge, this article will give you a comprehensive and enriching vision of
Module:Subject bar/styles.css, with the aim of delving into its meaning and relevance in today's world.
/* {{pp-template}} */
.subjectbar {
background-color: #f9f9f9;
border: 1px solid #aaa;
clear: both;
box-sizing: border-box;
font-size: 88%;
}
.subjectbar-row {
display: flex;
flex: 0 0 100%;
flex-direction: column;
}
.subjectbar-row:not(:last-child) {
border-bottom: 1px solid #aaa;
}
.subjectbar-heading {
align-items: center;
border-bottom: 1px solid #aaa;
display: flex;
flex: 0;
flex-direction: column;
justify-content: center;
min-width: 125px;
padding-left: 3px;
padding-right: 3px;
}
.subjectbar-cell {
display: flex;
flex: 0 auto;
flex-direction: row;
flex-wrap: wrap;
padding-bottom: 0.7em;
}
.subjectbar-item {
display: flex;
flex-direction: row;
margin: 0.7em 0 0 0.7em;
}
.subjectbar-item > div:first-child {
align-items: center;
display: flex;
flex: 0 1;
justify-content: center;
min-width: 30px;
}
.subjectbar-item > div:last-child {
display: flex;
flex: 1 0;
flex-direction: column;
margin-left: 0.5em;
justify-content: center;
width: 10em;
}
@media screen and (min-width:720px) {
.subjectbar-row {
flex-direction: row;
}
.subjectbar-heading {
align-items: flex-start;
border-bottom: 0;
border-right: 1px solid #aaa;
}
}