Moderator
Andrew Nevins
(@anevins)
WCLDN 2018 Contributor | Volunteer support
You can apply CSS to desktop-only screen sizes through Media Queries: http://css-tricks.com/snippets/css/media-queries-for-standard-devices/
Thanks Andrew – trying media queries but not having much luck yet…
I would like a theme to always use the whole screen (full left to right) – especially w/ bigger desktop screens..
– right now – Using twenty thirteen or fourteen theme (and child) I can’t seems to make the whole site use the whole screen…
Q: Is there a preexisting theme setting in twenty thirteen or fourteen theme the will set this without having to add media queries to the child theme?
Q: is there another theme that will do this automatically with adding extra code?
as example: I tried adding this quick test to the 2014 child…
@media only screen
and (min-width : 1824px) {
body {
width: 99%;
}
/* Styles */
}
—– but it didn’t fill out the large screen like I expected
maybe what is inside the body (like header etc.)) is keeping it back?
Moderator
Andrew Nevins
(@anevins)
WCLDN 2018 Contributor | Volunteer support
Hi Andrew,
right now just a new blank install with twenty fourteen theme
on the sample page I tried setting it to FULL WIDTH template – but still not filling up right side…
also top header does not go all the way to the right….
http://testpaternity.net/?page_id=2
Moderator
Andrew Nevins
(@anevins)
WCLDN 2018 Contributor | Volunteer support
Sorry I can’t load that page, I get a never-ending loading white page
Thanks much for helping
– maybe I was doing something at that time…
please try again
the top paragraph is gibberish with no Breaks so it should go all the way right I think….
http://testpaternity.net/?page_id=2
Moderator
Andrew Nevins
(@anevins)
WCLDN 2018 Contributor | Volunteer support
So you were saying this didn’t work:
@media only screen
and (min-width : 1824px) {
body {
width: 99%;
}
/* Styles */
}
But what screen size were you viewing the website on with this change?
Hi,
Correct – this did not work when I sent this to the child theme
I have a 15 inch laptop – with an attached 1920 X 1080 large monitor
When I opened and maximized the browser window on both the 15 inch monitor and the large 1920 X 1080 monitor – there was still whitespace on the right and did not expand accordingly
I’m sure I have something set incorrectly – I’m just a newbie and not sure what it is – any ideas?
Also as an example I loaded “iconic theme”
it says it has “full width template”
this seems to naturally center the site – and when I put it on the large monitor it appears the that whole body of the site is lets say about 1100px and then there is more white space on the LEFT AND RIGHT on the bigger screen….
What I was hoping for is that the basic body of the site would get LARGER then 1100px when it was a on a bigger screen…
Does that make sense?
Q: Is there a way that the basic body of the site would get LARGER then 1100px or so when it was a on a bigger screen…
Moderator
Andrew Nevins
(@anevins)
WCLDN 2018 Contributor | Volunteer support
When I opened and maximized the browser window on both the 15 inch monitor and the large 1920 X 1080 monitor – there was still whitespace on the right and did not expand accordingly
The body isn’t the thing that’s constraining your website, see: http://snag.gy/zef9x.jpg ?
Moderator
Andrew Nevins
(@anevins)
WCLDN 2018 Contributor | Volunteer support
So try:
@media only screen
and (min-width : 1824px) {
.site {
max-width: 100%;
}
/* Styles */
}
Moderator
Andrew Nevins
(@anevins)
WCLDN 2018 Contributor | Volunteer support
