Template

News header/styles.css

From Dogcraft Wiki

No edit summary
No edit summary
 
(5 intermediate revisions by the same user not shown)
Line 17: Line 17:
}
}


div.tleft, div.floatleft, div.center {
div.tleft, div.floatleft {
margin: 1rem 0 0 15%;
margin: 1rem 0 0 15%;
}
div.center {
margin: 1rem 15% 0 15%;
}
div.center img {
min-width: 100%;
max-width: 100%;
height: auto;
}
}


Line 35: Line 45:


@media screen and (max-width: 1000px) {
@media screen and (max-width: 1000px) {
p {
p {
column-count: 1;
column-count: 1;
}
}
}
@media screen and (max-width: 800px) {
div.tleft, div.floatleft {
margin: 0;
padding: 1rem 15% 0 15%;
float: none;
}
div.tleft .thumbinner, div.floatleft .thumbinner, div.tright .thumbinner, div.floatright .thumbinner {
width: 100% !important;
}
div.tleft img, div.floatleft img, div.tright img, div.floatright img{
max-width: 100%;
min-width: 100%;
height: auto;
}
div.tright, div.floatright {
margin: 0;
padding: 1rem 15% 0 15%;
float: none;
}
}
}


@media screen and (max-width: 450px) {
@media screen and (max-width: 640px) {
p {
p {
margin: 0;
margin: 0;

Latest revision as of 15:40, 26 January 2024

p {
	margin: 1rem 15%;
	/*display:grid;
	grid-template-columns: 1fr 1fr;*/
	column-gap: 1rem;
	text-align: justify;
	column-count: 2;
}

div:not([class*="thumb"]):not([class*="float"]):not([class="center"]) {
	margin: 1rem 15%;
	/*display:grid;
	grid-template-columns: 1fr 1fr;*/
	column-gap: 1rem;
	text-align: justify;
	column-count: 2;
}

div.tleft, div.floatleft {
	margin: 1rem 0 0 15%;
}

div.center {
	margin: 1rem 15% 0 15%;
}

div.center img {
	min-width: 100%;
	max-width: 100%;
	height: auto;
}

div.tright, div.floatright {
	margin: 1rem 15% 0 0;
}

h1,h2,h3,h4 {
	padding: 1rem 15%;
	text-align: center;
}

hr {
	margin: 0 15%;
}

@media screen and (max-width: 1000px) {
	
	p {
		column-count: 1;
	}
	
}

@media screen and (max-width: 800px) {
	
	div.tleft, div.floatleft {
		margin: 0;
		padding: 1rem 15% 0 15%;
		float: none;
	}
	
	div.tleft .thumbinner, div.floatleft .thumbinner, div.tright .thumbinner, div.floatright .thumbinner {
		width: 100% !important;
	}
	
	div.tleft img, div.floatleft img, div.tright img, div.floatright img{
		max-width: 100%;
		min-width: 100%;
		height: auto;
	}

	div.tright, div.floatright {
		margin: 0;
		padding: 1rem 15% 0 15%;
		float: none;
	}
	
}

@media screen and (max-width: 640px) {
	p {
		margin: 0;
		padding: 1rem 0;
	}
	h1,h2,h3,h4 {
		padding: 1rem 0;
	}
	hr {
		margin: 0;
	}
	
	div.tleft, div.floatleft, div.center {
		margin: 0;
		padding: 1rem 0 0 0;
		float: none;
	}

	div.tright, div.floatright {
		margin: 0;
		padding: 1rem 0 0 0;
		float: none;
	}
}