![]() ![]() I recommend running it full screen with the SO editor, because since I haven't done any responsive css, the columns just condense into one big block, and its hard to see what's going on. Oh, and of course, here is the code, and a codepen link. Here is a picture of what is happening with the spacing of the columns when I set a width on the columns: I know that inevitably the smaller I go, I will have to change the column widths with a media query to get them to turn into two columns, and then one, so that's not a problem. I am stumped on how to keep the columns the same as the screen changes sizes. To do this, go to the Editor screen and click on the Columns button. A new dashboard on the left will open with the element’s settings. First, you’ll need to create a new column in your WordPress site’s content area. However, when I add a width property to my columns, the spacing in between them grows much larger. Follow the steps in this article to add a Navigation Menu to your page. Normally I'd be fine doing this, but the requirement is that the item in each column should stay fixed in size, and that the columns should have 16px of spacing in between them at all times. I am attempting to create a set of columns that degrades gracefully from three columns to one with css. The columns will re-arrange automatically depending on the screen size: On a big screen it might look better with the content organized in three columns, but on a small screen it might be better if the content were stacked on top of each other. ![]()
0 Comments
Leave a Reply. |