2020-12-04 22:51:29 +00:00
/ * *
2020-12-06 16:30:14 +00:00
* Basic responsive layout for the reference container
2020-12-04 22:51:29 +00:00
*
* Based on Hello Elementor v2 . 3 . 0 Basic responsive layout
2020-12-06 16:30:14 +00:00
* themes / hello-elementor / theme . css : 8 . . 31
2020-12-04 22:51:29 +00:00
* licensed under GNU General Public License v3 or later
* License URI : https : / / www . gnu . org / licenses / gpl-3 . 0 . html
*
2020-12-06 16:30:14 +00:00
* Since v2 . 1 . 4 of Footnotes
2020-12-04 22:51:29 +00:00
*
2020-12-16 12:06:11 +00:00
* Last modified for v2 . 2 . 4 2020-12-16T0624 + 0100
2020-12-06 16:30:14 +00:00
*
* The enqueuing of this style sheet is optional and can be
* enabled in the Reference container settings .
* * /
2020-12-04 22:51:29 +00:00
/ * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * *
2020-12-06 16:30:14 +00:00
Rationale
2020-12-04 22:51:29 +00:00
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 :
2020-12-15 10:01:17 +00:00
body : not ( [ class * = "elementor-page-" ] )
2020-12-04 22:51:29 +00:00
Therefore , in pages built with Elementor , proper layout is
applied only to features managed by Elementor , not others .
2020-12-15 10:01:17 +00:00
Footnotes reference containers are near the bottom of main .
This style sheet lets Footnotes ’ reference containers come
2020-12-04 22:51:29 +00:00
into the benefit of the basic responsive layout style rules
that would apply if the page were not built with Elementor .
2020-12-16 12:06:11 +00:00
This is mainly useful with Hello Elementor , but it may help
fix also other themes like Twenty Twenty-One for display in
older browsers not yet supporting CSS variables .
2020-12-04 22:51:29 +00:00
* /
2020-12-15 10:01:17 +00:00
. entry-content div . footnotes_reference_container ,
2020-12-16 12:06:11 +00:00
. entry-content > . footnotes_reference_container ,
2020-12-15 10:01:17 +00:00
main div . footnotes_reference_container {
margin : 0 auto ;
2020-12-04 22:51:29 +00:00
}
@ media ( max-width : 575px ) {
2020-12-15 10:01:17 +00:00
. entry-content div . footnotes_reference_container ,
2020-12-18 16:31:09 +00:00
. entry-content > . footnotes_reference_container ,
main div . footnotes_reference_container {
2020-12-15 10:01:17 +00:00
padding : 0 10px ;
2020-12-04 22:51:29 +00:00
}
}
@ media ( min-width : 576px ) {
2020-12-15 10:01:17 +00:00
. entry-content div . footnotes_reference_container ,
2020-12-18 16:31:09 +00:00
. entry-content > . footnotes_reference_container ,
2020-12-15 10:01:17 +00:00
main div . footnotes_reference_container {
2020-12-04 22:51:29 +00:00
max-width : 500px ;
}
}
@ media ( min-width : 768px ) {
2020-12-15 10:01:17 +00:00
. entry-content div . footnotes_reference_container ,
2020-12-18 16:31:09 +00:00
. entry-content > . footnotes_reference_container ,
2020-12-15 10:01:17 +00:00
main div . footnotes_reference_container {
2020-12-04 22:51:29 +00:00
max-width : 600px ;
}
}
@ media ( min-width : 992px ) {
2020-12-15 10:01:17 +00:00
. entry-content div . footnotes_reference_container ,
2020-12-18 16:31:09 +00:00
. entry-content > . footnotes_reference_container ,
2020-12-15 10:01:17 +00:00
main div . footnotes_reference_container {
2020-12-04 22:51:29 +00:00
max-width : 800px ;
}
}
@ media ( min-width : 1200px ) {
2020-12-15 10:01:17 +00:00
. entry-content div . footnotes_reference_container ,
2020-12-18 16:31:09 +00:00
. entry-content > . footnotes_reference_container ,
2020-12-15 10:01:17 +00:00
main div . footnotes_reference_container {
2020-12-04 22:51:29 +00:00
max-width : 960px ;
}
}
