Parallax Container not full width, cant align text left or right

[offdarecord]

Hi,

I’m trying to mirror the parallax containers on this site: http://newfarmfete.com.au/ where is has the body of the containers more adjusted left and right than I can seem to make it on my site.

My site (in early build phase) is here: http://aimobi.me/school/

From the knowledge base article, I did add the following to my custom CSS with no luck.
#main-container > .container {
width: 100%;
max-width: 100%;
}

I’m also having no luck having an Alt-background colour fill the parallax background instead of an image.

Thanks in advance, David.

[Rui Guerreiro – SUPPORT]

Hi,

Can you explain further that mirror effect you are talking about? Can’t understand exactly what you are trying to achieve.

If the background-image is replaced by a color then the parallax effect is gone. Are you really sure about this?

-Rui

[offdarecord]

Hi Rui,

Noted re: Parallax colour issue. I’m sure there are other ways to achieve the same result however I was trying to mirror the approach used on the newfarm site (inspecting their element, it seems that’s how they did it).

The real issue is having the ability to move the image “Best of Ascot Vale” left and right across the page. It’s also an image file, rather than a text block. I’ve marked up a screen shot of what I am trying to do.

Regards, David

Attachments:

You must be logged in to view attached files.

[offdarecord]

Just to add as well, when I say mirror. It’s not a design feature….literally I am trying to copy or replicate what the new farm site has achieved. Apologies for not being clearer.

[Rui Guerreiro – SUPPORT]

The parallax effect only works with images with a fixed background color you can see any parallax movement. What is the url of that newsfarm site?

Regarding the attached image, you need to add an extra class to that asset(is one of the fields) so it can be targeted with some css. Already changed this to you so you can learn.

https://www.dropbox.com/s/s6nit9ydbfd2m8t/Screenshot%202017-05-16%2018.39.28.png?dl=0

.best-of-ascot .spb_content_wrapper.container {
    margin-left: 450px;
}

-Rui

[offdarecord]

Thanks Rui,

I’ve added the custom CSS and its achieving the outcome I was after. We can close that part.

The URL is http://newfarmfete.com.au/

Check out the “What’s On”….looks like it’s a parallax component, using an ALT background color instead of an image.

Regards, David

[Rui Guerreiro – SUPPORT]

Cool.
That page doesn’t have any parallax effect, it’s just a normal row background color.

-Rui

[offdarecord]

Thanks Rui.
Moving to ‘resolved’.

[Rui Guerreiro – SUPPORT]

No problem. Glad I could help.

-Rui