100VW & 100VH

User 450830 Photo


Registered User
143 posts

In RSD I can do a div 100% full screen width and height.
I would also like to apply at RCS 100% full screen width and height. Is this possible
User 187934 Photo


Senior Advisor
19,190 posts

Hi Ger,
Have you given it a try. I think there were some other users trying it and they placed the RCS inside a row on RSD.
Obviously the proper width setting will be need.
I can't hear what I'm looking at.
It's easy to overlook something you're not looking for.

This is a site I built for my work.(RSD)
http://esmansgreenhouse.com
This is a site I built for use in my job.(HTML Editor)
https://pestlogbook.com
This is my personal site used for testing and as an easy way to share photos.(RLM imported to RSD)
https://ericrohloff.com
User 2699991 Photo


Registered User
3,028 posts
Online Now

Ger van veen wrote:
In RSD I can do a div 100% full screen width and height.
I would also like to apply at RCS 100% full screen width and height. Is this possible


have you checked out the template in RCS "Art Explosion" maybe thats what you are after, have a look and see what the settings are
https://mawarputih.id
The Help You Need: When You Need It The Most
Website Design & Development
Website Renovations
Wayans' Theme Park
Page Ingredients
User 450830 Photo


Registered User
143 posts

Thanks Eric and Wayanjaya

It is not about the in width, that's easy.
The problem is that I want full screen height, and that it adjusts automatically.

In RSD you have the opportunity: 100 Height%
This I do not back into RCS.

My question is, here is an opportunity for
User 187934 Photo


Senior Advisor
19,190 posts

Hopefully RSD and RLM will support vh and vw soon. I guess an override style sheet will be needed.
I can't hear what I'm looking at.
It's easy to overlook something you're not looking for.

This is a site I built for my work.(RSD)
http://esmansgreenhouse.com
This is a site I built for use in my job.(HTML Editor)
https://pestlogbook.com
This is my personal site used for testing and as an easy way to share photos.(RLM imported to RSD)
https://ericrohloff.com
User 2699991 Photo


Registered User
3,028 posts
Online Now

I suppose one other problem would be the image size to take into account, you would probably have to have a lot of different size images to allow for the different heights, or you would have to do an awful lot of positioning to ensure the best view of the image at different sizes is achieved.
https://mawarputih.id
The Help You Need: When You Need It The Most
Website Design & Development
Website Renovations
Wayans' Theme Park
Page Ingredients
User 122279 Photo


Senior Advisor
13,163 posts
Online Now

I think what is holding CC back from implementing vh and vw and all those, is the lack of browser support. IE and Edge are not quite up to it yet.
Ha en riktig god dag!
Inger, Norway
My new honey site, built with RFF: https://eikweb.com/horgenhonning/
Component sharing for RFF, RBB, RSD and SD: https://eikweb.com/sharing/


User 2666911 Photo


Registered User
12 posts

Hi Ger, I was looking for a similar solution, not sure if it's what you want but I managed to make a 100% height and width RCS buy putting the HTML inside a 100% height row and column in RSD, then applying 100% height to every child element in the slideshow using an override css file.

Example here:

http://www.ptnsystems.com/yourwebsite/

Not sure how long this will be live though as I use this site for development purposes so here's some longhand css which may help explain:

body > .row.ROW-CLF.SLIDESHOW
{height: 100%;}

.html-element.slideshow-header
{height: 100%;}

.slideshow_container .slides_container
{height: 100%;}

.slideshow_container#slideshow-homepage .slideshow.slideshow-1
{height: 100%;}

.slideshow_container.slideshow-container-1#slideshow-homepage
{height: 100%;}

.slideshow_container#slideshow-homepage > .slideshow .slider-container.container-clf
{height: 100%;}

.slideshow_container#slideshow-homepage .slides_container > .slide.slide-1, .slideshow_container#slideshow-homepage .slides_container > .slide.slide-2, .slideshow_container#slideshow-homepage .slides_container > .slide.slide-3
{height: 100%;}
User 2666911 Photo


Registered User
12 posts

Update to my previous post, if you have no child elements that need explicit height you can use something like this as well:

body > .row > [class*='coffee-span-'].col-slideshow * {
height:100%;
max-height:600px;
}

Have something to add? We’d love to hear it!
You must have an account to participate. Please Sign In Here, then join the conversation.