I am converting a Windows visual database program to a mobile site and the Responsive Layout Maker Pro is EXACTLY what I need, right when I need it.

My database has a grid of three rows and four columns. What I would like to accomplish using RML is for the grid to automatically wrap from 4x3, to 3x4, to 2x6, to 1x12 based upon viewing portal.

The sample I have set up is a single column (12 spans), single row. The 12 image links are identical (4:4; Width:25%; Max:350; Min:125; Padding 0,7,0,7; Margin 7,Auto,7,Auto; Float: left; Clear:Neutral)

The images all wrap perfectly, but as soon as they wrap, the padding in between them is lost and they all display together edge-to-edge even though there is plenty of space left for the padding to be applied.

Here is the example site. Shrinking/scaling your browser will show what happens on mobile platforms.

http://www.ALL-CON.net/2 (Domain is just one of convenience for testing and not related to the database project.)

Thank you for any insights on how to approach differently or correct what I have started.

Hi SuperCollector,

Just a quick question, do they appear with padding within the RLMP before you export it?

Hello Steve,

No, the padding vanishes within RLM also.

.rlmp attached for your convenience

Thanks!

I am not at home to check this out. Maybe someone else in the forum will be able to open this file and check it for you. However that being said, When you get to the break point when they drop edge to edge can you not adjust the padding to separate them a bit?

Looking at this layout, you only have 2 rows. You have one for the header area and then another row with 12 columns. I would create the 4 rows needed and divide them up into equal spans and then move the images into each column. You then can create the breakpoints needed for 4x3, to 3x4, to 2x6, to 1x12.

You can see a working example of this grid on my website actually. Now I have set a background color but you can see the padding remains consistent. I accomplished this by doing exactly as Scott suggested.

http://misterwebguy.com/webTemplate.html