Template
News header/styles.css
From Dogcraft Wiki
No edit summary |
No edit summary |
||
(7 intermediate revisions by the same user not shown) | |||
Line 17: | Line 17: | ||
} | } | ||
div.tleft, div.floatleft | 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: | @media screen and (max-width: 640px) { | ||
p { | p { | ||
margin: 0; | margin: 0; | ||
Line 53: | Line 91: | ||
div.tleft, div.floatleft, div.center { | div.tleft, div.floatleft, div.center { | ||
margin: 1rem 0 0 0; | margin: 0; | ||
padding: 1rem 0 0 0; | |||
float: none; | |||
} | } | ||
div.tright, div.floatright { | div.tright, div.floatright { | ||
margin: 1rem 0 0 0; | margin: 0; | ||
padding: 1rem 0 0 0; | |||
float: none; | |||
} | } | ||
} | } |
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;
}
}