Tagged: 

Viewing 20 posts - 1 through 20 (of 20 total)
  • Author
    Posts
  • January 12, 2018 at 6:39 pm #896647
    lzevon

    Is it possible to bleed the caption background (I’m using left framed) so it always touches the outside left edge of the page on a full width site. Right now it frames it ~70px in from the left edge and I want the box/shadow flush left (see screen shot).

    Thank you.

    January 13, 2018 at 1:11 am #896756
    Nikko

    Hey lzevon,

    Can you also post a link to your site? so we can take a closer look.

    Best regards,
    Nikko

    January 13, 2018 at 1:12 am #896757
    lzevon

    It doesn’t seem necessary Nikko and I’d need to get approval to do so. It should be clear from the screenshot what I’m looking to do.

    January 14, 2018 at 4:04 am #896996
    Rikard

    Hi,

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

    .slideshow_caption {
    padding: 0 !important;
}

    Best regards,
    Rikard

    January 17, 2018 at 1:06 am #898249
    lzevon

    No, that doesn’t work. I will have to figure it out. Based purely on the image and what padding does it should apparent the code you supplied would not work!

    January 18, 2018 at 8:47 am #898932
    Rikard

    Hi,

    I’m not sure I understand by your last post, but I think we will need to inspect the actual element in order to be able to help you out. Maybe you need to remove the container element width restriction?

    Best regards,
    Rikard

    January 18, 2018 at 4:53 pm #899199
    lzevon

    If you create your own slider using the full width easy slider and use a left framed caption you will see it is forced in from the left XX number of pixels. What I’m asking and is depicted in the image I provided is how to make just the shadowbox bleed all the way from the left edge, so there are no pixels and the shadowbox runs all the way from the left edge. Can you please look at the image I provided and then create your own left framed caption and evaluate the difference to see what I’m after?

    January 19, 2018 at 1:18 pm #899662
    Rikard

    Hi,

    I read your first question again and I think I misunderstood you, you are looking to align the text to the left inside of the frame, not the entire caption? If so then please try this instead:

    .avia-caption-title {
  padding-left:0 !important;
}

    Best regards,
    Rikard

    January 19, 2018 at 5:30 pm #899778
    lzevon

    The image I sent in private data was a mock-up, not an actual web page. It is what I WANT to accomplish on the web page. Currently the [left aligned and boxed] caption starts in from the left edge X number of pixels (depending upon the screen width) and I want the box flush left but keep the padding of the text within the box.

    I have tried messing with div.slideshow_caption and .slideshow_align_caption and can get it to move left with a negative left margin value, but not using position and left elements. The negative margin value is only good for the current viewport size.

    January 21, 2018 at 6:34 am #900266
    Rikard

    Hi,

    Ok, please try this instead:

    .caption_container {
    max-width: 100% !important;
    width: 100% !important;
    padding: 0 !important;
    margin: 0 !important;
}

    Best regards,
    Rikard

    January 22, 2018 at 5:02 pm #900885
    lzevon

    No, but thanks Rikard. I am not using anything special, just a fullwidth east slider with a left framed caption. So having me try things (that have so far not worked) seems counterproductive. Also i would assume since it’s a fullwidth site that position/left attributes would need to be in play, but it seems I’ve not been able to isolate what class or ID to target.

    January 23, 2018 at 8:02 am #901243
    Rikard

    Hi,

    Ok, thanks for the feedback. I’m not sure what else we can try if the CSS is not working and we can’t have access to your site?

    Best regards,
    Rikard

    January 23, 2018 at 4:56 pm #901556
    lzevon

    I believe the issue is you’re targeting the wrong element. I have also stated that it’s nothing special, just a full width easy slider and the image shows what I’m after. I would think you had a test environment on your side to test what I’m trying to do so I don;t have to send you the credentials to a live customer site when there is nothing special in play here?

    January 24, 2018 at 6:36 am #901946
    Rikard

    Hi,

    Of course we have local test installations, where do you think I’m getting the code from? But since none of the code I have sent you is working, and I can’t view your site, then what options do we have left?

    Best regards,
    Rikard

    January 24, 2018 at 5:19 pm #902230
    lzevon

    I set-up a test server with a theme demo install and the slider/caption is on “Homepage.” Since I’m running the theme demo and have done virtually nothing to it you would’ve thought your examples would work since they do on your side.

    January 25, 2018 at 6:59 am #902643
    Rikard

    Hi,

    Thanks for that. Please try this CSS to see if works out for you:

    .caption_container {
  max-width:100% !important;
  padding:0 !important;
}

.slideshow_caption {
  padding:0 !important;
}

    Best regards,
    Rikard

    January 25, 2018 at 5:37 pm #902918
    lzevon

    Getting there, some issues on mobile devices (doesn’t go to the left edge. This is a great start, thank you

    January 25, 2018 at 11:32 pm #903087
    Nikko

    Hi,

    Try adding this css code:

    @media only screen and (max-width:767px) {
  .responsive #top #wrap_all .container.caption_container {
    width: 100%;
    max-width: 100%;
  }
}

    Hope this helps :)

    Best regards,
    Nikko

    January 26, 2018 at 4:16 pm #903422
    lzevon

    Nailed it, thanks Nikko and Rikard.

    January 26, 2018 at 11:16 pm #903559
    Nikko

    Hi,

    Glad we could help. Thanks for using Enfold :)

    Best regards,
    Nikko

  • Author
    Posts
Viewing 20 posts - 1 through 20 (of 20 total)
  • The topic ‘fullwidth east slider bleed caption background’ is closed to new replies.