.force-full-screen Class

2 replies · opened Aug 31, 2020

Jjasonp128Aug 31, 2020

I'm trying to get my slider to display a portrait image full screen on mobile devices. I've followed several of the posts you've answered previously in the forum to change the image on different screen sizes, and all works great, but I can't seem to locate the .force-full-screen class anywhere in any of the corresponding CSS documents. Adding it to the section class doesn't seem to do anything different I think because it isn't defined in the docs. Could you point me in the direction of the CSS for the .force-full-screen class?

Code:
<section id="slider" class="slider-element min-vh-md-100 py-4 include-header force-full-screen full-screen" style="background-size: cover;">
<div class="slider-inner">
<div class="vertical-middle slider-element-fade">
<div class="container text-center py-5">
<div class="emphasis-title mb-2">

attachment

</div>
</div>
</div>

[](#)
            
&lt;/div&gt;

</section>

SSemicolon WebSTAFFSep 1, 2020

The .force-full-screen and .full-screen Class were removed from the Latest Version of Canvas and replaced with more flexible Height Utility Classes: http://docs.semicolonweb.com/docs/utility-classes/heights/ !

According to your Codes above, simply use the following code for displaying Full Screen Sections on Mobile Devices:
[ch_pre][/ch_pre]

This will definitely work fine. Hope this Helps!

Jjasonp128Sep 1, 2020

thank you! The height class was exactly what I was looking for.

Have the same question, or something new?

Sign in to the Canvas dashboard to reply or open your own topic. Canvas owners get direct help from the SemiColonWeb team.

Reply on the dashboard