Create this in muffin builder

senorberns · August 2018

Hi,

I have a mockup of what I want to do for a section of my website: https://imgur.com/r7nJQi6

I've attempted it a few ways:

1) whole thing as background, issue is aligning the header and text properly. Especially for mobile resizing.

2) Line on left is background, and image on right as background. But I can't overlap the lines properly.

Any suggestions?

Bryan · August 2018

Hi,

You can use the "equal height of wraps" option:

The equal height of wraps is used to position elements on: top, middle or bottom in wraps. In order to achieve this you need to:
1. Edit your page, and go to the muffin builder. Edit a section and under the advanced>style select 'equal height of wraps'. See screens:
http://prntscr.com/f40hvn
http://prntscr.com/f40kh0
2. Now edit each wrap in that section and set the desired vertical align(top, middle or bottom). See screens:
http://prntscr.com/f40kvr
http://prntscr.com/f40lhl

senorberns · August 2018

So you would create the line susing html/css <hr>?

senorberns · August 2018

http://bit.ly/2ORKMf1 This is what I've come up with so far, any ideas to perfect it?

Pablo · August 2018

As I see, everything is looking good.

You want to overlap them in what sense?

Can you show me it on the picture?

Thanks.

senorberns · August 2018

I want it to look like this: https://imgur.com/a/rJAMcZO, not the top line.

I'm also having toruble with how to deal with it responsively, try and resize the browser on: http://bit.ly/2ORKMf1

Pablo · August 2018

1) Sorry, but this is not possible.

Our theme allows only to overlap something by moving thigs up, not left or right.

2) Make sure that your RevSlider is made similiar to this:

https://www.themepunch.com/faq/slider-revolution-responsive-tutorial-5-0/

Thanks.

Create this in muffin builder

Comments