Viewing 17 posts - 1 through 17 (of 17 total)
  • Author
    Posts
  • October 29, 2022 at 7:37 pm #1370657
    AuroraArcus

    Hello support,

    Im trying to change the height and width within this png that has been linked in a caption for the mobile version of the fullwidth slider.

    I used this code and nothing changes. Am I making a mistake?

    Psykolog Therese velkommen

    October 30, 2022 at 12:05 pm #1370692
    Rikard

    Hey AuroraArcus,

    I can see the image you are using, but I’m not sure what you are looking to change on mobile. Could you try to explain your intentions a bit further please? Also, on which page are you using the image? I can’t see it on your front page.

    Best regards,
    Rikard

    October 30, 2022 at 12:44 pm #1370698
    AuroraArcus

    Hey Rikard,

    Im trying to make the PNG smaller, so its not so big. Pretty much aligned with the width of the other part of the caption. Hope it makes sense:)?

    Im using it in the caption on my front page “Fullwidth Easy Slider”…

    October 30, 2022 at 1:32 pm #1370702
    Rikard

    Hi,

    Thanks for the clarification. If you add an ID to the image markup like in private, then you can use CSS like this in Quick CSS:

    #velkommen-image {
  max-width: 200px;
}

    Best regards,
    Rikard

    • This reply was modified 2 years ago by Rikard.
    October 30, 2022 at 6:09 pm #1370715
    AuroraArcus

    Thanks Rikard,

    I couldnt make that work. Im going into Enfold Child>General Styling>Quick CSS and I pasted;

    #velkommen-image {
    max-width: 200px;
    }
    into the Quick CSS field. It didn’t work out.

    Maybe I don’t understand what to do. Where do I add an ID to the image markup?

    Best regards,
    Aurora

    October 30, 2022 at 8:20 pm #1370721
    Yigit

    Hi Aurora,

    I edited your Img tag in caption and added ID as Rikard recommended however it was not reflected on the front end of your site even though I cleared cache. So I targeted the image using alt attribute as following in Quick CSS field

    
#top img[alt="Psykolog Therese velkommen"] {
  max-width: 240px;
  margin-left: 0;
}

    Please review your website and adjust the width as needed :)

    Best regards,
    Yigit

    October 31, 2022 at 12:47 pm #1370795
    AuroraArcus

    Well done Yigit,

    I had the same problem as you. I altered both PNGs now and it works perfect.

    For some reason the captions are in different places and I cant figure out why or adjust the position. Is there a way to finetune that, so I can make sure they are placed left of the face with a good distance and at the same posiiton…

    Best regards,
    Aurora

    October 31, 2022 at 9:44 pm #1370862
    AuroraArcus

    Hi again Yigit,

    It works for the mobile now, but it also changed for the fullscreen slider for the homepage. I tried put in another version of the picture but it doesnt work. The deal is that on desktop its not supposed to be as small as on mobile.

    Do you have a suggestion for a solution:)

    November 1, 2022 at 9:48 am #1370881
    AuroraArcus

    Hi again Yigit,

    I solved it by renaming the #top img[alt=”Psykolog Therese velkommen”] {
    max-width: 240px;
    margin-left: 0;
    }

    to

    #top img[alt=”Psykolog Therese velkommen stor”] {
    max-width: 240px;
    margin-left: 0;
    }

    I still need to move the caption though. Would be great to hear your solution:)

    November 1, 2022 at 12:27 pm #1370889
    Rikard

    Hi,

    Thanks for the update. Could you post a screenshot highlighting what you would like to change or alter?

    Best regards,
    Rikard

    November 1, 2022 at 3:51 pm #1370919
    AuroraArcus

    Hi,

    Ive linked 2 screenshots.

    Its the captions left of her face, that I need to move left and up or down. Does that make sense:)?

    November 1, 2022 at 8:20 pm #1370958
    Rikard

    Hi,

    Thanks for that. Please try the following in Quick CSS under Enfold->General Styling:

    @media only screen and (max-width: 767px) {
.caption_bottom .slideshow_caption .slideshow_inner_caption {
  padding: 0; 
  width: 40%;
}
}

    Best regards,
    Rikard

    November 1, 2022 at 8:38 pm #1370968
    AuroraArcus

    Hi Rikard,

    thanks right back at you:)

    It works.

    How would I move the caption up and down, so the 2 captions from the slideshow end up right on top of each other?

    November 1, 2022 at 9:04 pm #1370981
    Rikard

    Hi,

    Please try this CSS as well:

    @media only screen and (max-width: 767px) {
.slideshow_align_caption {
  vertical-align: bottom; 
}
}

    Best regards,
    Rikard

    November 1, 2022 at 9:07 pm #1370986
    AuroraArcus

    Well done Rikard,

    works great and you can close the case:)

    November 2, 2022 at 3:27 pm #1371067
    Rikard

    Hi,

    Great, I’m glad that we could help. I’ll close this thread for now then, please open a new thread if you should have any further questions or problems.

    Best regards,
    Rikard

    November 2, 2022 at 3:27 pm #1371068
    Rikard

    Hi,

    Great, I’m glad that we could help. I’ll close this thread for now then, please open a new thread if you should have any further questions or problems.

    Best regards,
    Rikard

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