0c7436506a
git-svn-id: https://plugins.svn.wordpress.org/footnotes/tags/2.2.4@2440595 b8457f37-d9ea-0310-8a92-e5e31aec5664
79 lines
1.8 KiB
CSS
79 lines
1.8 KiB
CSS
/**
|
||
* Basic responsive layout for the entry content div
|
||
*
|
||
* Based on Hello Elementor v2.3.0 Basic responsive layout
|
||
* themes/hello-elementor/theme.css:8..31
|
||
* licensed under GNU General Public License v3 or later
|
||
* License URI: https://www.gnu.org/licenses/gpl-3.0.html
|
||
*
|
||
* Since v2.1.4 of Footnotes
|
||
*
|
||
* Last modified for v2.2.2 2020-12-15T1004+0100
|
||
*
|
||
* The enqueuing of this style sheet is optional and can be
|
||
* enabled in the Reference container settings.
|
||
**/
|
||
|
||
/***********************************************************
|
||
Rationale
|
||
|
||
In Hello Elementor Theme, this applies to .site-header, and
|
||
also to .site-main, which is a class of the <main> element,
|
||
at the condition that the page is not built with Elementor:
|
||
body:not([class*="elementor-page-"])
|
||
Therefore, in pages built with Elementor, proper layout is
|
||
applied only to features managed by Elementor, not others.
|
||
|
||
Footnotes reference containers are near the bottom of main.
|
||
This style sheet lets Footnotes’ reference containers come
|
||
into the benefit of the basic responsive layout style rules
|
||
that would apply if the page were not built with Elementor.
|
||
|
||
This is mainly useful with Hello Elementor but it helps fix
|
||
also other themes like Twenty Twenty-One.
|
||
*/
|
||
|
||
div.page-content,
|
||
div.entry-content {
|
||
margin: 0 auto;
|
||
}
|
||
|
||
@media (max-width: 575px) {
|
||
|
||
div.page-content,
|
||
div.entry-content {
|
||
padding: 0 10px;
|
||
}
|
||
}
|
||
|
||
@media (min-width: 576px) {
|
||
|
||
div.page-content,
|
||
div.entry-content {
|
||
max-width: 500px;
|
||
}
|
||
}
|
||
|
||
@media (min-width: 768px) {
|
||
|
||
div.page-content,
|
||
div.entry-content {
|
||
max-width: 600px;
|
||
}
|
||
}
|
||
|
||
@media (min-width: 992px) {
|
||
|
||
div.page-content,
|
||
div.entry-content {
|
||
max-width: 800px;
|
||
}
|
||
}
|
||
|
||
@media (min-width: 1200px) {
|
||
|
||
div.page-content,
|
||
div.entry-content {
|
||
max-width: 960px;
|
||
}
|
||
}
|