"jumping" columns - Post ID 267023

User 300493 Photo


Registered User
96 posts

I have now spent the best part of my afternoon trying to figure this little problem.

Coffee as an additive no longer helps, and before I move to something stronger, I am taking a chance with the great help from this forum.

You will see on the attached file that point 2 does not line up as it should. A number of interesting things happen if I look closer. ( Please note:Every point sit in an individual row with identical class name. Every row has 2 identical columns, also class named)
1. If I duplicate row with point 1, the "problem" moves to the new row.
2. If I move the slider at the top to smaller than 391px (there is no breakpoint at 391) the problem is solved.
3. If I move the slider to larger than 754px (again with no breakpoint at 754) the problem also rears its head on point 4.

Any ideas?
Attachments:
Know that we really only think we know
User 300493 Photo


Registered User
96 posts

what the page looks like on my server

http://chi.nanfei.tours/test05/en.cnfbook.html
Know that we really only think we know
User 122279 Photo


Senior Advisor
14,447 posts
Online Now

You have a -2 top margin on some breakpoints. Remove that margin.
Ha en riktig god dag!
Inger, Norway

My work in progress:
Components for Site Designer and the HTML Editor: https://mock-up.coffeecup.com


User 300493 Photo


Registered User
96 posts

Thanks Inger.

Interesting question: There was a -2 top margin on all the rows. Why does it only affect some of the rows?
Know that we really only think we know
User 122279 Photo


Senior Advisor
14,447 posts
Online Now

I think it must be because #1 and #3 are quite short paragraphs, and the columns that the numbers are sitting in are larger than the corresponding text column height. Therefore there was not room for that negative margin on the columns below them.
Ha en riktig god dag!
Inger, Norway

My work in progress:
Components for Site Designer and the HTML Editor: https://mock-up.coffeecup.com


User 2699991 Photo


Registered User
4,782 posts
Online Now

You could of course have always used a list container inserted into just one column with the No of Elements set to 6

then change the " List Settings - List Type = None"
all margins to zero

Position to "Position Relative"

Then in each "List Item Container" insert element "text"

type your list with the numbers

eg

1. Complete the booking request form below and submit.
2. On receipt of the booking request, and once we confirm the tour, you are required to pay a non-refundable deposit of R 1500,00 per person per trip, within 7 days of booking. Payment must be made to your travel agent or to the account of Chi. NAN FEI. This payment is in respect of the LAND PORTION only.
* Chi. NAN FEI Bank account details will be made available at that time.

and so on.

set each List Item Container with the same class and set the top margin to whatever you want

(it actually describes a bit more complicated than it is to do)

anyway just a though to keep in mind if ever you have to do something similar


Mastering The Understanding With Hands-On Learning
NEW TO "COFFEECUP SITE DESIGNER" FOUNDATION 6 FRAMEWORK?
STUCK ON SOMETHING?

LEARNING & UNDERSTANDING "THE HOW TO"? THE WHY'S & THE WHEREFORE'S?
WITH WAYAN'S STEP BY STEP TUTORIALS
Contact Me For One To One Assistance
https://alphathemes.coffeecup.com/forms … an%281%29/
User 300493 Photo


Registered User
96 posts

Thanks Wayan,
That is an alternative I have used many times.

I have a problem with the way that system handle the left margin. Same as in RSD, and for that reason I prefer my method.

Faure
Cape Town.
Know that we really only think we know

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.