Fullscreen slider - 50% height on one row?
-
Hello :)
I was wondering if there is a CSS or Jquery fix which would allow for the last row of a project page to be only 50% height, when the rest of the page uses the full screen slider? By this I mean when the last row slides into view it stops and fills only the bottom half of the screen.
Thanks!
-
Dear @StudioTomas
with CUSTOM CSS you can give the last row a specific height of 50%. That should be possible, yes.Best!
Marius
-
Hi Marius, thanks for the quick reply! I did try to do that by giving the row a class and using the custom css 50vh but it seems like the Fullscreen slider overrides that - any ideas? Thanks!
-
Dear @StudioTomas
try the important tag:
https://www.css-hack.de/CSS+allgemein/!+importantIt will probably overwrite.
Best!
Marius -
Hi Marius,
Thank you :) unfortunately that doesn't work.
Here's my custom CSS:
.halffooter: {
height: 50vh! important;
}The halffooter class is applied to the row I want to be 50% height with the fullscreen slider.
-
That’s simply because you got a minor typo in there – Your space is in the wrong place 😉
Intead of:
.halffooter: { height: 50vh! important; }
It should be:
.halffooter: { height: 50vh !important; }
Best is to write these things in a code editor with syntax highlighting like Sublime Text. You can define which language you are writing and the editor highlights the syntax that’s wrong / right like above 👆
When all code is done copy-paste it into Lay Theme as desired.Hope that helps!
-
-
Thank very much to you both @mariusjopen and @edgrbnz - sorry I didn't reply sooner and thanks for the Sublime text tip, I do sometimes use that but missed the space this time!
Unfortunately though that edit does not work either. My site is studiotomas.com and I have a test half height section at the bottom of the home page.
Any other ideas of a workaround are most welcome! :)
-
Dear @StudioTomas
that is because you use the Fullscreen Slider. You can not combine it with the fullscreen slider.You could make a box in the last slide and change it with CSS.
Best!
Marius
-
Hi Marius,
Ah ok, my question has always been about the fullscreen slider!
What I was trying was to make a footer like the one at the bottom of the page on this site: www.afom.com.au.
Is this definitely impossible with Lay theme? If so, no worries, maybe I'm being too ambitious!
Thanks :)
-
Dear @StudioTomas
you could probably trick it somehow. With jQuery or some tricky CUSTOM CSS:But also I don't know how to be honest.
:-)
Best!
Marius
Before you post:
- When using a WordPress Cache plugin, disable it or clear your cache.
- Update Lay Theme and all Lay Theme Addons
- Disable all Plugins
- Go to Lay Options → Custom CSS & HTML, click "Turn Off All Custom Code", click "Save Changes"
This often solves issues you might run into
When you post:
- Post a link to where the problem is
- Does the problem happen on Chrome, Firefox, Safari or iPhone or Android?
- If the problem is difficult to explain, post screenshots / link to a video to explain it