Divided the page in two photo no margin


(Franco) #1

Good evening,
I would like to make a site with an introductory page exactly like this:

The page must be divided into two photos NO MARGIN, ONLY PHOTOS. In the left you go to the photograph in the right to the painting. I need something very simple like the site in example.
Can you give me some advice.
Thanks.


(Joe Workman) #2

I mocked up a quick split layout using my Jack and Target stacks… http://sandbox.joeworkman.net/split/

I made only one side have an image because I thought that looked nicer. But you could easily add images to both sides. In order to make the split seamless though, you would need to apply a background image across the entire page, then the second background would only cover 50% of the page.

However, in the page that you referenced, I am pretty sure that the background is just one image.

Here is a screenshot of my setup using Jack + Target. I used my Foundation theme that you can download for free.


(Franco) #3

Perfect! Thanks! :slight_smile:


(Franco) #4

Good evening,
I bought Jack, I made the main page with the photo 50% and 50%. Everything perfect but now I ask for a new help…
How do I put an inscription on the photo with the links of sites?
Like this site? http://www.darioballantini.it/home.php
Thanks.


(Joe Workman) #5

If you set the background image on Jack, then you can just place text content inside of it. If you want more control on where that is placed, I used my Target stack in the demo to center the text vertically.


(Franco) #6

Good evening, I bought also target but when I insert jack imposed the background then target and then the text. The preview is blank, completely white.
Are there any tutorials where you can see how to do?
Or examples with settings …
Thanks.


(Joe Workman) #7

You want to setup Jack so that its using a Flexible Height of 100%. Then set Target to be Relative to Parent and vertical align center.