Viewing 7 posts - 1 through 7 (of 7 total)
  • Author
    Posts
  • August 21, 2020 at 11:28 pm #1239893
    rhae

    Hi,

    I have a Color Section with a full width background. Within that Color Section there’s a few text boxes, and one image that should run from side to side, the full browser width. I’ve tried some custom CSS stuff, but can’t get it to work. Is it possible, and if so, can you help me get it to work?
    This is what I’m trying to achieve: Example 1.
    And this is what I have now: Example 2.

    The background grows automatically depending on the amount of content, and the line with flags should grow in width as well.
    It can’t be part of the background, because of responsive issues with the text around it.

    I hope someone can help.
    Best regards, Haiko.

    August 23, 2020 at 5:26 pm #1240151
    Victoria

    Hey rhae,

    Best regards,
    Victoria

    August 24, 2020 at 11:15 am #1240305
    rhae

    Hi Victoria,

    thank you for looking into it. Do you know of another way I could accomplish what I want?
    I need that background image to work like it does now, and my way of doing it was putting it inside the color section.
    Can I add a background to a post -every post will get a different background- in another way, mimicking the way it works now?
    (Full screen background, parallax, top center, no repeat) I could do without the parallax effect.

    Best regards, Haiko.

    August 30, 2020 at 12:13 pm #1241892
    Victoria

    Hi rhae,

    The page goes to a 404 page, do you have another page where we can see the issue?

    Best regards,
    Victoria

    August 30, 2020 at 1:46 pm #1241914
    rhae

    Hi Victoria,

    sorry about that, the work on the site went on and that page must have been replaced.
    I added a link to the private content.

    Best regards, Haiko.

    • This reply was modified 4 years, 2 months ago by rhae.
    August 31, 2020 at 11:55 am #1242115
    Victoria

    Hi Haiko,

    Unfortunately, I can’t come with the css to make that image full-width. Maybe my colleagues can help. I’ll ask them to have a look.

    Best regards,
    Victoria

    August 31, 2020 at 9:00 pm #1242284
    Ismael

    Hey!

    There are a lot of ways to do this, but one thing that we can carry out in the current layout is make the image inherit the width of the browser view port and pull it towards the left to re-align it to the center of the page. You can then adjust the surrounding elements afterwards.

    Please try this css code.

    .avia-image-container img {
	width: 100vw;
	max-width: 100vw;
        position: absolute;
	left: -50vw;
	right: auto;
}

    You have to apply a custom css class attribute or name to the image element and adjust the above css selector accordingly.

    Best regards,
    Ismael

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