Template:Essay quote/style.css: Difference between revisions

Template page
No edit summary
No edit summary
Line 26: Line 26:


/* selectable alignment with {{{align}}} parameter */
/* selectable alignment with {{{align}}} parameter */
.left{
.essay-quote-left{
float:left;
float:left;
clear:both;
clear:both;
Line 32: Line 32:
}
}


.right{
.essay-quote-right{
float:right;
float:right;
clear:both;
clear:both;
Line 38: Line 38:
}
}


.center{
.essay-quote-center{
     text-align: center;
     text-align: center;
     margin: 0 auto;
     margin:0 auto;
    width:100%;
}
}


Line 47: Line 46:


@media screen and (max-width:768px){
@media screen and (max-width:768px){
.left{
.essay-quote-left{
text-align: center;
text-align: center;
     margin: 0 auto;
     margin: 0 auto;
     width:100%;
     width:100%;
}
}
.right{
.essay-quote-right{
text-align: center;
text-align: center;
     margin: 0 auto;
     margin: 0 auto;

Revision as of 22:20, 19 September 2023

.essay-quote{
	/* container for whole quote thing */

}

.essay-quote-mark{
	/* just the quotation mark that appears behind the quote */
	user-select:none;
	font-size:8rem;
	position:relative;
	z-index:1;
	color:#7f7f7f;
	opacity:0.5;
	font-family: Serif;
	font-weight:bold;
}

.essay-quote-text{
	position:relative;
	font-size:2rem;
	left:-15px;
	top:-50px;
	z-index:2;
}


/* selectable alignment with {{{align}}} parameter */
.essay-quote-left{
	float:left;
	clear:both;
	max-width:25%;
}

.essay-quote-right{
	float:right;
	clear:both;
	max-width:25%;
}

.essay-quote-center{
    text-align: center;
    margin:0 auto;
}

/* Mobile positioning */

@media screen and (max-width:768px){
	.essay-quote-left{
	text-align: center;
    margin: 0 auto;
    width:100%;
	}
	.essay-quote-right{
	text-align: center;
    margin: 0 auto;
    width:100%;
	}
}