-
Posts
-
Hi there,
I have used a full width Layer Slider on the home page, however i have white text at the bottom which isn’t very clear.
I added a transparent block behind the text in order to make the title stand out. However this is part of the image so when the screen size is increased the transparent block expands beneath the text.
How would i create a 100% transparent div within the slider, whilst keeping the the title in its current position? Every time i use Layers Container it moves both the text and transparent block.
I do hope that wasent to confusing, if it helps you can find a link to the site below.
http://uprisetestdomain.co.uk/paramount/
Kind Regards,
Hi,
Add a new layer, select Div/Video then add this code
<div id="caption-container-full"><div class="caption-container-full-center">
THE WORKPLACE OF THE FUTURE</div></div>Set the animation on Options tab to Transition In/Out to Fade, duration to 0.
On Style tab set the following options.
Top: 410px (Adjust this according to the height of your slider)
Padding: 10px for each field (top left right bottom)
Font Size: 40px
Font Color: White
Custom Style Settings: width: auto; display: block; background: rgba(0,0,0,.5); position: relative; bottom: 0; text-align: center;
Then edit custom.css or Quick CSS, add this code
#.caption-container-full {
bottom: 0;
}
.caption-container-full-center {
display: block;
width: 1024px;
text-align: left;
margin: 0 auto;
}You will have a responsive caption container.
Regards,
Ismael
Thanks so much Ismael, i will implement this later today and let you know the results.
You guys really are leading the way for WordPress development support.
Regards,
Jyles
- The topic ‘Layer Slider WP on Home Page – Need div to run 100% across the screen’ is closed to new replies.