Blocks overlay each other on small screen, how do I fix this?
Permalink
**Problem Solved!**
***I just had to re-insert the blocks after applying the bootstrap grid system!***
Hi!
I am having a problem with the responsiveness of my site (building my own template from scratch).
When decreasing the side of the site, my blocks float over each other. I am new to concrete5, I am only used to bootstrap's properties, where block jump under each other on small screen sizes. How do I do this in concrete5?
I attached screenshots of my problem.
My code is simple:
<div class="welcome">
<?php
$a = new Area('Welcome');
$a->enableGridContainer();
$a->display($c);
?>
</div>
I then in edit mode made three containers, added a text block to each and an image.
Any ideas on how could I make the blocks float under each other on smaller screens?
***I just had to re-insert the blocks after applying the bootstrap grid system!***
Hi!
I am having a problem with the responsiveness of my site (building my own template from scratch).
When decreasing the side of the site, my blocks float over each other. I am new to concrete5, I am only used to bootstrap's properties, where block jump under each other on small screen sizes. How do I do this in concrete5?
I attached screenshots of my problem.
My code is simple:
<div class="welcome">
<?php
$a = new Area('Welcome');
$a->enableGridContainer();
$a->display($c);
?>
</div>
I then in edit mode made three containers, added a text block to each and an image.
Any ideas on how could I make the blocks float under each other on smaller screens?
Thanks for your reply, yeah, the blocks have bootstrap 3 properties, still not working. However, when I deleted the blocks and replaced them with new ones, they worked how they were supposed to. :)
do you have a public URL where this is occurring?
If it said "Free Form Layout" you probably have to adjust your page_theme.php to tell it that you want to use bootstrap 3 on your site.