You could try adding the following CSS to your style.css in your theme folder.
@media screen and (max-width: 600px) {
.full_width, .one_half, .one_third, .two_third, .one_fourth,
.three_fourth, .one_fifth, .two_fifth, .three_fifth,
.four_fifth, .one_sixth {
clear: both;
width: 100%;
margin-left: 0;
margin-right: 0;
}
}
Thanks man, this works perfectly. Really, really appreciate you taking the time to reply. All the best, I’m gna go 5star this plugin now! 🙂
No problem =) Thanks for taking the time to rate it.
Tobias:
I would like to suggest a fix for columns that have been given padding but the padding doesn’t get removed when the columns “stack” through the media query (I.e. when someone uses a mobile browser):
.full_width > div[style],
.one_half > div[style],
.one_third > div[style],
.two_third > div[style],
.one_fourth > div[style],
.three_fourth > div[style],
.one_fifth > div[style],
.two_fifth > div[style],
.three_fifth > div[style],
.four_fifth > div[style],
.one_sixth > div[style] {
padding-left: 0 !important;
padding-right: 0 !important;
}
You’ve already put the changes in your response to corbeja in the release version of column shortcodes so this would be a small addition.
Due to the way you’ve had to code column shortcodes (to allow people to enter any value of padding) it gets added “inline”. This is difficult to remedy but (depending on browser) the above fix should help columns become 100% the width of the container when the media query is run…
