I am having difficulty with the body of a website under construction. There are basically 3 columns of text. 3 spans, 6 spans and 3 spans. For the sake of this discussion I will number them 1,2 &3. At a breakpoint for smaller screen sizes I have changed the spans for the columns to 6, 12, & 6. They display in the same order (1,2,3). Since columns 1 & 3 are both 6 spans, I would like to have them display side by side (creating 12 spans) and column 2 would obviously fill its 12 spans.

I have read about the push and pull, but that does not seem to be helping me get them in the proper order. Either there is something I am missing, possibly in the positioning, or I am going about the whole thing wrong. Assistance would be appreciated.

You can use flex for this. You set the parent container to display flex, and then you can reorder the immediate children.

However, since you can't set a row to display flex, you need to build your site with one column covering 12 spans, and then inside the column you can place three containers next to each other and give them 25% - 50% - 25% width.

A column can be set to display flex, and then the immediate children will be the containers. They can be reordered.

Thank you very much Inger. I was still puzzled on the settings for the column under the "position" settings. I was about to give up, when I stumbled onto a combination that worked for me. Since I am not real clear on what the different settings mean, it was trial and error. However, as I stated that did the trick Thank you very much.