Stack Overflow
Stack Overflow

Questions tagged [css-multicolumn-layout]

The Multi-Column Layout module in CSS allow users to layout their content in a column format, based on a number of different properties.

The Multi-Column Layout module in CSS allows users to layout their content in a column format, based on a number of different properties.

This includes setting a column count or a column height, to automatically split content to fit, as well as setting a column gap, to control spacing, and more.

Read the W3C Specification:
https://www.w3.org/TR/css3-multicol/

Read the guide on MDN Web Docs:
https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_Columns/Using_multi-column_layouts

344 questions
1
vote
2 answers

Div containing columns is too tall

(I've looked at some other questions like this on stack, particularly Extra space at the bottom of CSS columns, but I couldn't see the issue the asker was having in the fiddle he presented, and trying that solution didn't work anyways.) Anyways, I…
whiterook6
  • 3,270
  • 3
  • 34
  • 77
1
vote
1 answer

Wordpress & CSS3 column-count

I'm trying to divide an events list into 2 columns. When I do a simple column-count, I can't seem to get them to align at the top. What am I missing here?? The domain is here
Aaron Stanley
  • 75
  • 2
  • 9
1
vote
0 answers

Not able to set background of container of multi-column (using column-width) article

I am developing a JavaScript-based Metro app for Windows 8. I am trying to set background of container having a multi-column article. Basically, I have a listview on the left and a multi-column article on the right (similar to split view). I am…
Gurpreet Singh
  • 5,075
  • 1
  • 13
  • 10
1
vote
2 answers

Strategies for overflowing content in CSS3 multi-column

I am trying to setup multi-column layout using the new multi-column layout. But is there anyway to allow flexible widths for the created columns? All strategies I've seen online always result in fixed-width layouts, even when the content overflows…
chustar
  • 12,225
  • 24
  • 81
  • 119
0
votes
1 answer

My Blueprint CSS doesn't work with an uneven number of columns

I am using Blueprint CSS on a Rails app. I am making this a 4-column layout with a box around each item. If I have 4 items or 8 items, then everything is fine and I have 2 rows of products. If I have a 9th product or anything not divisible by 4,…
noob
  • 1,807
  • 2
  • 18
  • 34
0
votes
0 answers

function Activate/Deactive/Hide ( ) is not working for inline-blocks

I have a modal popup that shows different content based on buttons clicked. The popup is layed out in columns, with the right column having the content that is shown differently based on the button pressed. When you first open the popup there is…
spencerm269
  • 1
0
votes
1 answer

CSS: left to right newspaper-style columns with differently sized boxes

I want to arrange differently sized boxes in a "newspaper-style", but with elements arranged left-to-right first, and then top-to-bottom. So the goal is to get something that looks like this: I know that the column module was built for…
Chris_77
  • 173
  • 1
  • 5
0
votes
1 answer

Specify the padding between rows in a checkboxGroupInput

This is my shiny application: ui.R # values to show, or not show, these will be the 'choices' and 'selected' values # for the checkboxGroupInput() all_rows <- 1:25 names(all_rows) <- paste("Row", all_rows) # data control: the checkboxes will…
Lev
  • 693
  • 1
  • 8
  • 24
0
votes
2 answers

How to split into new column via multi-column layout only when text is overflowing

I'm looking for a way to dynamically break a continuous text into multiple columns only if the content of the first column is overflowing. It should be responsive and work for any device width. The solution can be (S)css or JavaScript. I already…
Spielefreak
  • 23
  • 4
0
votes
0 answers

How to keep the heading with first paragraph in a html multi column together

I am receiving content from the backend, which need to render in a multi column layout, and the headline and the first paragraph should always stay together and must not slide in two different columns. I read some articles here, but they did not…
David Kimont
  • 11
  • 1
0
votes
2 answers

How to get word processor like column-orientated "text"-flow via HTML+CSS?

To find a meaningful title was difficult for me. I try to force my HTML document to have same text flow behavior like typical word processors have. Please take a look at the following container flow: 1 2 3 |-------------| | ~~~ ~~~ ~~~ | |…
Barock
  • 427
  • 1
  • 4
  • 12
0
votes
1 answer

Issue With Column Positioning Layout

I could not find something similar to my issue anywhere on the web (I also don't know exactly what to call it), so I was hoping someone here might be able to help out. I don't really know how to explain it, so I'll just post images and code. What…
Greenreader9
  • 491
  • 4
  • 12
0
votes
1 answer

How do I tell to Firefox that it's fine for a div to span multiple columns?

On a page, I use a layout where the text is positioned in two columns when the page is large enough. This works well in Chromium, but not in Firefox. The content is structured like this:

Title goes here

…
Arseni Mourzenko
  • 50,338
  • 35
  • 112
  • 199
0
votes
2 answers

Can I repeat table header with page broken into columns?

I have a lengthy, but narrow two-column table. Rather than scroll vertically down the page, I want the table to wrap into as many columns as the page will fit. So I put that table into a div tag with multiple columns:
phillipdhall
  • 21
  • 4
0
votes
1 answer

Trouble centering CSS columns

I have a three column box in css, I need it to center on the page for the desktop and then stack the columns on top of each other in 600px or less. I have everything working except having it centered on the desktop view. I have tried adding…
Duane
  • 3
  • 1
1 2 3
…
22 23