1

I'm trying to create a layout with automatic CSS columns. They look fine in Firefox but behave very strangely in Opera (both latest versions, Mac).

In Opera when there is sufficient content, the text all appears vertically centred in the columns, whereas I want it to be top-aligned (and would expect it to be by default).

Also if there is a lot of content without a break, it reverts to a single column and seems to 'break out' of the flow.

I have tried vertical-align and I have been fiddling about with flex – but this seems to break the columns completely.

.two-col .textwidget {
    -webkit-column-gap: 50px; /* Chrome, Safari, Opera */
    -moz-column-gap: 50px; /* Firefox */
    column-gap: 50px;
    -webkit-column-count:2;  /* Chrome, Safari, Opera */
    -moz-column-count:2; /* Firefox */
    column-count:2;
}

As I said in Firefox it appears how I would expect and how I would like. In Opera – no.

2

0

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Browse other questions tagged or ask your own question.