Title: Coding & columns
Last modified: August 19, 2016
---
# Coding & columns
* Resolved [belenenses](https://wordpress.org/support/users/belenenses/)
* (@belenenses)
* [15 years, 3 months ago](https://wordpress.org/support/topic/coding-columns/)
* Hi Guys,
* As I am new to all this, I am trying to stack up, one-under-the-other, two four-
column sections on a page. It won’t work and they all merge.
* Do I need to put some kind of page break between the two sets of columns? If
so, what’s the magic code?
* Thanks,
* B
Viewing 15 replies - 1 through 15 (of 16 total)
1 [2](https://wordpress.org/support/topic/coding-columns/page/2/?output_format=md)
[→](https://wordpress.org/support/topic/coding-columns/page/2/?output_format=md)
* [David Ollenberger](https://wordpress.org/support/users/david-ollenberger/)
* (@david-ollenberger)
* [15 years, 3 months ago](https://wordpress.org/support/topic/coding-columns/#post-1943507)
* Hello,
* There are several ways you can do columns of content with HTML. The old way would
be to use tables to create the columns. This isn’t ideal and is a bit old school.
Here is a standard way to do this with CSS and floating divs (make sure you use
HTML view in the WordPress editor to do this).
* ```
Column 1
Column 2
Column 3
Column 4
```
* Make sure you include the following CSS in your style sheet:
* ```
.column {
float: left;
width: 200px;
padding: 10px;
}
.clear {
width: 100%;
clear: both;
}
```
* Just replace the width of the column with your own width and make sure you have
enough room to fit 4 of those columns (plus the padding) horizontally. Good luck!
* Cheers,
David
* Thread Starter [belenenses](https://wordpress.org/support/users/belenenses/)
* (@belenenses)
* [15 years, 3 months ago](https://wordpress.org/support/topic/coding-columns/#post-1943515)
* Hi David,
* Many thnaks for your informative and helpful response. I’ll note it for future
reference.
* However, I’m using a theme that has custom shortcodes. The one for 4 columns
is:
* [one_fourth] [one_fourth] [one_fourth] [one_fourth_last]
* But I cannot work out how to use this twice and put some padding between the
two. I tried your but it isn’t enough. Any ideas? I’d
rather not touch the css if I can help it!
* Cheers,
* B
* [David Ollenberger](https://wordpress.org/support/users/david-ollenberger/)
* (@david-ollenberger)
* [15 years, 3 months ago](https://wordpress.org/support/topic/coding-columns/#post-1943531)
* Hello,
* Ok, now I understand what you’re trying to do. It all depends greatly on what
HTML the shortcode is producing. Can you provide a URL with an example of the
4 columns? If so, I can take a quick look at the source and see if you can do
anything with it.
* Cheers,
David
* Thread Starter [belenenses](https://wordpress.org/support/users/belenenses/)
* (@belenenses)
* [15 years, 3 months ago](https://wordpress.org/support/topic/coding-columns/#post-1943597)
* Hi,
* Here’s the url:
* [http://walking-holidays-france.com/wordpress/1786/walking-provence-west/](http://walking-holidays-france.com/wordpress/1786/walking-provence-west/)
* If I just put 4 days across the page it works okay, but it’s an 8-day tour!
* Many thanks,
* B
* [David Ollenberger](https://wordpress.org/support/users/david-ollenberger/)
* (@david-ollenberger)
* [15 years, 3 months ago](https://wordpress.org/support/topic/coding-columns/#post-1943603)
* Hello,
* I can see you put in the div with a class of “clear” as I suggested:
* ``
* Did you put the matching CSS in for that div? Without that it won’t do anything.
If you didn’t then you can do inline styling without touching the style sheet
like this and it should work:
* ``
* Cheers,
David
* Thread Starter [belenenses](https://wordpress.org/support/users/belenenses/)
* (@belenenses)
* [15 years, 3 months ago](https://wordpress.org/support/topic/coding-columns/#post-1943610)
* Hi,
* Thanks for your efforts, but the inline styling without touching the style sheet
by adding:
*
* Hasn’t worked. Any further suggestions?
* Thanks,
* B
* [Michael](https://wordpress.org/support/users/alchymyth/)
* (@alchymyth)
* [15 years, 3 months ago](https://wordpress.org/support/topic/coding-columns/#post-1943616)
* double check your syntax with the shortcodes – the fourth and fifth day don’t
seem to be separated properly, and the last day has a typing error with an excess/
in `[/one_fourth_last]`
* Thread Starter [belenenses](https://wordpress.org/support/users/belenenses/)
* (@belenenses)
* [15 years, 3 months ago](https://wordpress.org/support/topic/coding-columns/#post-1943621)
* Hi,
* We’ll it looks like it’s just the separation issue that’s now outdstanding. I’m
sure there must be a simple way of separating the fourth and fifth days so Day
5 is pushed down in a series with 6 and 7.
* I’ve tried everything except touching the css as these are shortcodes.
* B
* [Michael](https://wordpress.org/support/users/alchymyth/)
* (@alchymyth)
* [15 years, 3 months ago](https://wordpress.org/support/topic/coding-columns/#post-1943624)
* what is the code that you type into the post editor?
* could you paste the code into a [http://wordpress.pastebin.com/](http://wordpress.pastebin.com/)
and post the link to it here?
* for instance ‘day4’ does not seem to have the ‘one-fourth-last’ div/style; ‘day5’
seems to be within the ‘day4’ div, and ‘day7’ does have no ‘one-fourth’ div/style
at all.
* Thread Starter [belenenses](https://wordpress.org/support/users/belenenses/)
* (@belenenses)
* [15 years, 3 months ago](https://wordpress.org/support/topic/coding-columns/#post-1943635)
* Hi,
* The code we are told to input is:
* [one_fourth][one_fourth][one_fourth][one_fourth_last]
* Having done it, WP seems to have added the /s itself. I’m not sure whethetr it
needs them or not.
* I have thus tried to simply input the code twise.
* B
* [Michael](https://wordpress.org/support/users/alchymyth/)
* (@alchymyth)
* [15 years, 3 months ago](https://wordpress.org/support/topic/coding-columns/#post-1943637)
* > The code we are told to input is:
> [one_fourth][one_fourth][one_fourth][one_fourth_last]
* and you would add you other content just between these shortcodes?
* just wondering how the shortcode is supposed to know when the fourth column for
instance is finished.
* if the shortcode came with the theme, is this a commercial theme?
* have you tried to get support from the theme author/seller?
* Thread Starter [belenenses](https://wordpress.org/support/users/belenenses/)
* (@belenenses)
* [15 years, 3 months ago](https://wordpress.org/support/topic/coding-columns/#post-1943642)
* Yes, I just add text in between.
* Do you think the coding is incomplete?
* Yes, a commercial theme where some support is available, but very irregular.
Thus my posting here.
* [Michael](https://wordpress.org/support/users/alchymyth/)
* (@alchymyth)
* [15 years, 3 months ago](https://wordpress.org/support/topic/coding-columns/#post-1943645)
* > Do you think the coding is incomplete?
* your ‘one_third’ section seems to have gone ok.
did you do anything different
there?
* hard to judge without having access to the full theme templates, such as functions.
php (?) to check the shortcode; or a possible ‘readme’ file.
* if you have the time, you could try:
* `[one_fourth]contents[/one_fourth] [one_fourth]second column contents[/one_fourth][
one_fourth]third col content[/one_fourth] [one_fourth_last]last column contents[/
one_fourth_last]`
* Thread Starter [belenenses](https://wordpress.org/support/users/belenenses/)
* (@belenenses)
* [15 years, 3 months ago](https://wordpress.org/support/topic/coding-columns/#post-1943653)
* Alchymyth,
* You’ve cracked it! Take a look now – it’s resolved and I’m very grateful. As
soon as I saw the…
* [one_fourth_last]last column contents[/one_fourth_last]
* I was optimistic and it made sense.
* I just wish I were so logical, but I’m prepared to remain a disciple!
* Many thanks for your valued input!
* B.
* [Michael](https://wordpress.org/support/users/alchymyth/)
* (@alchymyth)
* [15 years, 3 months ago](https://wordpress.org/support/topic/coding-columns/#post-1943654)
* well done 😉
* please mark this thread as ‘resolved’
Viewing 15 replies - 1 through 15 (of 16 total)
1 [2](https://wordpress.org/support/topic/coding-columns/page/2/?output_format=md)
[→](https://wordpress.org/support/topic/coding-columns/page/2/?output_format=md)
The topic ‘Coding & columns’ is closed to new replies.
* In: [Fixing WordPress](https://wordpress.org/support/forum/how-to-and-troubleshooting/)
* 16 replies
* 3 participants
* Last reply from: [belenenses](https://wordpress.org/support/users/belenenses/)
* Last activity: [15 years, 3 months ago](https://wordpress.org/support/topic/coding-columns/page/2/#post-1943657)
* Status: resolved
## Topics
### Topics with no replies
### Non-support topics
### Resolved topics
### Unresolved topics
### All topics