Template:Infobox/style.css: Difference between revisions

From Kerbal Powers Wiki
Jump to navigation Jump to search
Content deleted Content added
No edit summary
mNo edit summary
 
(33 intermediate revisions by the same user not shown)
Line 4: Line 4:
min-width: 200px;
min-width: 200px;
⚫
width: 30em;
⚫
max-width: 400px;
margin: 0.5em 0 0.5em 1em;
margin: 0.5em 0 0.5em 1em;
Line 18: Line 16:
}
}


.infobox-item {
.infobox-header, .infobox-illustration, .infobox-caption, .infobox-section-header {
/*column-span: 2;*/
vertical-align: top;
text-align: left;
⚫
width: 66%;
}

.infobox-item-title {
vertical-align: top;
text-align: right;
⚫
width: 34%;
}

.infobox-dual-illustration img, .infobox-illustration img {
⚫
width: auto;
⚫
height: auto;
⚫
object-fit: contain;
display: block;
margin-left: auto;
margin-right: auto;
}

.infobox-dual-illustration img {
⚫
max-width: 100%;
}

.infobox-dual-illustration {
width:100%;
}

.infobox-column {
vertical-align: top;
text-align: center;
}
}


Line 41: Line 69:
}
}


.infobox-illustration, .infobox-caption {
.infobox-illustration .infobox-dual-illustration {
margin: auto;
margin: auto;
margin-left: auto;
margin-right: auto;
text-align: center;
text-align: center;

}
}


.infobox-illustration img {
.infobox-dual-illustration {
width: auto;
width: 100%;

⚫
height: auto;
⚫
max-width: 30em;
⚫
max-height: 30em;
⚫
object-fit: contain;
}
}


.infobox-caption {
.infobox-caption {
text-align: center;
vertical-align: top;
color: #696969;
color: #696969;
font-style: italic;
font-style: italic;

Latest revision as of 22:19, 26 October 2022

.infobox {
	float: right;
	clear: right;
	
	min-width: 200px;
	margin: 0.5em 0 0.5em 1em;
	
	border: solid 1px grey;
	background-color: #f5f5f5;
	font-size: 90%;
}

.infobox.nofloat {
	float: none;
	margin: 0.5em auto;
}

.infobox-item {
	vertical-align: top; 
	text-align: left;
	width: 66%;
}

.infobox-item-title {
	vertical-align: top; 
	text-align: right;
	width: 34%;
}

.infobox-dual-illustration img, .infobox-illustration img {
	width: auto;
	height: auto;
	object-fit: contain;
	display: block;
	margin-left: auto;
	margin-right: auto;
}

.infobox-dual-illustration img {
	max-width: 100%;
}

.infobox-dual-illustration {
 	width:100%;
}

.infobox-column {
	vertical-align: top; 
	text-align: center;
}

.infobox-header {
	padding: 0.8em 2em;
	color: white;
	background-color: #696969;
	text-align: center;
}

.infobox-header .infobox-title {
	padding: 0;
	margin: 0 auto;
	color: inherit;
	font-size: 1.3em;
}

.infobox-header .infobox-subtitle {
	/*margin-top: .4em;*/
	font-style: italic;
}

.infobox-illustration .infobox-dual-illustration {
	margin: auto;
        margin-left: auto;
        margin-right: auto;
	text-align: center;

}

.infobox-dual-illustration {
	width: 100%;

}

.infobox-caption {
	text-align: center;
	vertical-align: top; 
	color: #696969;
	font-style: italic;
}

.infobox-section-header {
	background-color: #ddd;
	color: #222;
	font-size: 1.1em;
}