User:Vaileasys/sandbox 3: Difference between revisions
(quote & infobox css) |
(added quote to screen size 719px to appear after the infobox instead of overlapping) |
||
| Line 32: | Line 32: | ||
<syntaxhighlight lang="css"> | <syntaxhighlight lang="css"> | ||
@media screen and (max-width: 719px) { | @media screen and (max-width: 719px) { | ||
/* Template:Infobox */ | |||
div.infobox { | div.infobox { | ||
width: 100%; | width: 100%; | ||
} | |||
/* Template:Quote */ | |||
div.quote { | |||
clear: both; | |||
} | } | ||
} | } | ||
</syntaxhighlight> | </syntaxhighlight> | ||
Revision as of 07:39, 29 March 2024
“
this is some text
“
/* Outer container */
.quote {
display: flex;
font-family: 'Georgia', 'Times New Roman', 'Times', serif;
}
/* Inner left quotation mark */
.quote .quote-mark {
font-weight: bold;
font-size: 4em;
height: 1em;
}
/* Inner text container */
.quote .quote-text {
margin: 0.5em;
padding-left: 0.5em;
border-left: 1px solid #000000;
font-style: italic;
}
/* Author section */
.quote .quote-author {
text-align: right;
}
@media screen and (max-width: 719px) {
/* Template:Infobox */
div.infobox {
width: 100%;
}
/* Template:Quote */
div.quote {
clear: both;
}
}