Viewing 8 posts - 1 through 8 (of 8 total)
  • Author
    Posts
  • August 3, 2018 at 11:43 pm #993378
    805ITS

    Hello,

    I have an issue with my website. On bigger screen, the caption text on the slider does not stay in the same position as on smaller screeen. It goes to the bottom instead of being at the center : https://prnt.sc/kefnv7

    Also I would like the font to be bigger and bigger screen. The resolution I am using on this screen is 2560×1440.

    The CSS code I am using to center the text is the following :

    /* Center Text Full Screen Slider Front Page*/
.home .caption_bottom .slideshow_caption .slideshow_inner_caption {
    bottom: 180px !important;
    text-align: center !important;
}

    Thank you in advance for your help!

    August 4, 2018 at 8:29 am #993449
    Rikard

    Hey 805ITS,

    Please try the following in Quick CSS under Enfold->General Styling:

    @media only screen and (max-width: 479px) {
fullscreen-slider .caption_bottom .slideshow_caption {
    bottom: 80px;
}
}

    Adjust the value to your liking.

    Best regards,
    Rikard

    August 4, 2018 at 9:31 pm #993581
    805ITS

    Thank you but it does not change anything… Is px related to the screen resolution? Because my screen resolution is 2560×1440.

    August 6, 2018 at 9:00 pm #994096
    Yigit

    Hi,

    Please use the code as following

    /* Center Text Full Screen Slider Front Page on larger screens*/
@media only screen and (min-width: 1380px) { 
.home .caption_bottom .slideshow_caption .slideshow_inner_caption {
    bottom: 250px !important;
}}

    Best regards,
    Yigit

    August 6, 2018 at 10:04 pm #994116
    805ITS

    Thank you but this is not changing anything either. Even after changing the value of “bottom” dramatically I don’t see the position of the caption text moving even a bit. I am giving you access to my site if needed.

    August 9, 2018 at 1:14 pm #995446
    Victoria

    Hi 805ITS,

    Here is the code you can put in Enfold > General Styling > Quick Css,  if it does not work, put into themes/enfold/css/custom.css

    
.home .caption_bottom .slideshow_caption .slideshow_inner_caption {
    bottom: 35vh !important;
    text-align: center !important;
}

    If you need further assistance please let us know.

    Best regards,
    Victoria

    August 10, 2018 at 4:55 am #995802
    805ITS

    Thank you so much!! It’s working wonderfully. What is the “vh” ? Does that mean the caption text stays at the same position regardless of the screen size ? I was using px before and not vh.

    August 10, 2018 at 7:02 am #995830
    Rikard

    Hi,

    Thanks for the feedback. You can read more about the vh property here: https://www.w3schools.com/cssref/css_units.asp

    Best regards,
    Rikard

  • Author
    Posts
Viewing 8 posts - 1 through 8 (of 8 total)
  • You must be logged in to reply to this topic.