How to create area with 2 photos and...

User 2807025 Photo


Registered User
25 posts

New RED Business user here. Been working on the software and can't figure out how to do one thing. I'd like to create an area where there are two photos with captions side by side when viewed on larger screens,like this:
https://misenategopcdn.s3.amazonaws.com/16/newsletters/20151021_1.jpg

but re-orient themselves so that they are above and below each other, like this, on smaller screens:
https://misenategopcdn.s3.amazonaws.com/16/newsletters/20151021_2.jpg

How does one do this in RED? I tried two columns, but they keep shrinking down and staying side by side no matter where I set a breakpoint. Any suggestions?
User 103173 Photo


VP of Software Development
0 posts

That is where you use Breakpoints and on the lower Breakpoint, adjust the SPAN for the column from 6 to 12.

Here is a quick sample you can download that will show you how to set that up.
Attachments:
Learn the essentials with these quick tips for Responsive Site Designer, Responsive Email Designer, Foundation Framer, and the new Bootstrap Builder. You'll be making awesome, code-free responsive websites and newsletters like a boss.
User 232214 Photo


COO
827 posts

Hey William,

At your breakpoint, simply change the span-width to 12 for each of the columns. You can do that on the Layout Pane. Any other style changes such as text size etc will also only apply after the breakpoint.

It's really simply as soon as you have done it once :) Hope this helps!
The future of web layout has arrived and it's called CSS Grid. CoffeeCup helps you to get ready with a free guide, the Grid Builder app plus cool demos & themes.
User 2807025 Photo


Registered User
25 posts

Thank you, gentlemen. With both of your tips I made it happen. Thank you!
User 434929 Photo


Ambassador
938 posts

too late but here is short demo
https://www.youtube.com/watch?v=Xbnf0p9bFy0
Guys at coffeecup are awesometacular.
User 187934 Photo


Senior Advisor
20,188 posts
Online Now

Hi William, Were practically neighbors.:cool:
I can't hear what I'm looking at.
It's easy to overlook something you're not looking for.

This is a site I built for my work.(RSD)
http://esmansgreenhouse.com
This is a site I built for use in my job.(HTML Editor)
https://pestlogbook.com
This is my personal site used for testing and as an easy way to share photos.(RLM imported to RSD)
https://ericrohloff.com
User 2807025 Photo


Registered User
25 posts

Hi Eric! I live in Grand Ledge (originally from Bay City). The reason I purchased RED is because I work in the Senate Majority Communications Office, where I produce the email newsletters for members along with their websites. I also have a side business doing pretty much the same thing, only for political candidates. In fact, your State Senator (O'Brien) and previous one (Schuitmaker) are my clients. :)
User 187934 Photo


Senior Advisor
20,188 posts
Online Now

I love Grand Ledge. I use to go to an archery shop there called Anderson Archery. At the time it was the largest shop in the world. I use to also go through there on my way to my boys soccer games. I'll cut through there now to go to Mooville Creamery.
Welcome to the Coffeecup family.
I can't hear what I'm looking at.
It's easy to overlook something you're not looking for.

This is a site I built for my work.(RSD)
http://esmansgreenhouse.com
This is a site I built for use in my job.(HTML Editor)
https://pestlogbook.com
This is my personal site used for testing and as an easy way to share photos.(RLM imported to RSD)
https://ericrohloff.com
User 232214 Photo


COO
827 posts

William Carney wrote:
The reason I purchased RED is because I work in the Senate Majority Communications Office, where I produce the email newsletters for members along with their websites. In fact, your State Senator (O'Brien) and previous one (Schuitmaker) are my clients. :)


So our RED produces newsletters for Senators, pretty cool!!

:cool::P:D:)
The future of web layout has arrived and it's called CSS Grid. CoffeeCup helps you to get ready with a free guide, the Grid Builder app plus cool demos & themes.

Have something to add? We’d love to hear it!
You must have an account to participate. Please Sign In Here, then join the conversation.