Viewing 17 posts - 1 through 17 (of 17 total)
  • Author
    Posts
  • #1016571

    Hello,

    I want to change the font size of the blog post title, remove the line and also adjust the title text position in the featured image slider.

    I used the coding provided in thread #686685 and #686784, but they didn’t work.

    Any suggestion to resolve the issue is appreciated. The website is in private content.

    Thanks,

    Nik

    #1016588

    Hey Nik,

    How do you want to adjust the text? Try this CSS for the other changes:

    .home .avia-caption-title::after {
      display:none;
    }
    
    .home .avia-caption-title {
      font-size:10px !important;
    }

    Best regards,
    Rikard

    #1016767

    Hi Rikard,

    Thanks for your coding. Regretfully, they don’t work.

    I tried the coding on this thread yesterday. But it did not work. https://kriesi.at/support/topic/how-to-change-title-font-sized-of-featured-image-slider/

    Link to the page (home page) on what I would like to achieve is in private content. Any other suggestions is appreciated.

    Nik

    #1016785

    Hi,

    Have you tried adding the code to the very top of quick css so that it runs first. Also, be sure to clear your cache a few times over.

    Best regards,
    Jordan Shannon

    #1018476

    Hi Jordan,

    Thanks for your suggestion. They work when I view the page on Edge and IE, but not Firefox. Still couldn’t remove the dash line. I used the coding below.

    Any tips is much appreciated.

    Nik

     .home .avia-caption-title::after {
      display:none;
    }
    
    .home .avia-caption-title {
      font-size:15px !important;
    }
    
    .home .avia-caption-title { 
        position: absolute;
        left: 0 px;
        bottom: 20px;
    }
    
    #1018486

    Hi,

    Apologies, on which section are you seeing the dashline?

    Best regards,
    Jordan Shannon

    #1018589

    Hi Jordan,

    The dash is right below the title. Note that the text, position or dashline of the HOME PAGE did not change if viewed in Firefox. The change occur only when viewed with Edge or IE

    Go to details in private content for link to my explanation.

    Thanks for your help.

    Nik

    #1018795

    Hi Nik,

    Please try this to remove the dash:

    .home .avia-caption-title::after {
      display:none;
    }

    Best regards,
    Rikard

    #1018976

    Hi Rikard,

    I tried your suggested code. Still didn’t work. Am I missing something?

    Appreciate your help on this.

    Nik

    
    /*Change caption title size and position, remove dash*/
    
    .home .avia-caption-title {
      font-size:15px !important;
    }
    
    .home .avia-caption-title::after {
      display:none;
    }
    .home .avia-caption-title { 
        position: absolute;
        left: 0 px;
        bottom: 10px;
    }
    #1019062

    Hi,

    That should have worked. If you are running additional custom css there could possibly be an error in it thats preventing Rikard’s code from running. That’s why it’s important to add the code to the very top of quick css.

    Best regards,
    Jordan Shannon

    #1019492

    Hi Jordan,

    Regretfully, it didn’t work despite many, many attempts. I have given up and decided to use masonry instead. I used the code below to bring the overlay caption text to the bottom of the image. Found the code at https://kriesi.at/support/topic/masonry-gallery-17/

    Didn’t work. Am I missing something?

    .av-image-caption-overlay-center {
        vertical-align: 10px;
    }
    

    Your help is appreciated.

    Thanks,

    Nik

    #1019493

    Sorry, forgot to mention the Masonry is on the home page of the website.

    #1019556

    Hi Nik,

    Best regards,
    Victoria

    #1019661

    Hi Victoria,

    Thanks for getting back. I need to move all the caption titles to the lower third or bottom (about 10 px from the bottom) of all the images so readers can have a better view of the images.

    I would also like to center the caption titles.

    Thanks,

    Nik

    #1020175

    Hi,
    Please try this code in the General Styling > Quick CSS field:

    #top .av-caption-style-overlay .av-masonry-item-with-image .av-inner-masonry-content-pos {
        vertical-align: bottom !important; 
    }

    Best regards,
    Mike

    #1020631

    Awesome, Mike. Your coding did the job.

    Thanks so much.

    Nik

    #1020744

    Hi,

    I’m glad you were able to get this resolved. If you need additional help, please let us know here in the forums.

    Best regards,
    Jordan Shannon

Viewing 17 posts - 1 through 17 (of 17 total)
  • The topic ‘Change title font size, remove line, adjust text of "Featured Image Slider"’ is closed to new replies.