Twitter Bootstrap Grid issue
Permalink
I have installed and integrated into concrete5 a new bootstrap 3 theme and everything worked ok but suddenly i noticed that the bootstrap grid that i have enabled trough concrete 5 is not displaying the third column properly. I have put the new area inside a container class so it has to be responsive but it is not.
What could this be?
I have attached a few photos.
Thanks in advance,
erminos
What could this be?
I have attached a few photos.
Thanks in advance,
erminos
I also tried putting the new area inside a row but the container size gets bigger...
Does it work if you change your code to be
<div class="container">
<div class="row">
<?php
$a = new Area('Main Content2');
$a->setAreaGridMaximumColumns(12);
$a->display($c);
?>
</div>
</div>
In your example you will get "container" inside "container" (one in the markup and one by the C5 function).
Now its easy to fix this (see the docs) - but my tip is anytime you find "weird" grid result -
Inspect element and check if your code it the correct Bootstrap code (container - row - col) This is correct to any grid (You must match the grid structure).
---------------------------------
In the docs you find your issue:
C5 docs:http://documentation.concrete5.org/developers/designing-for-concret...
THE ANSWER - from the docs: "Add Grid With A Container
If you want to make this area griddable and automatically add a container class to the blocks that are added to it, add this line to the area.
Make sure this area isn't contained within a DIV with the class "container." It should be flush with the edge of the page. That's because the container class will automatically be injected into the area, now that we know what grid framework we're using."
Now its easy to fix this (see the docs) - but my tip is anytime you find "weird" grid result -
Inspect element and check if your code it the correct Bootstrap code (container - row - col) This is correct to any grid (You must match the grid structure).
---------------------------------
In the docs you find your issue:
C5 docs:http://documentation.concrete5.org/developers/designing-for-concret...
THE ANSWER - from the docs: "Add Grid With A Container
If you want to make this area griddable and automatically add a container class to the blocks that are added to it, add this line to the area.
` <?php $a = new Area('Welcome'); $a->enableGridContainer(); $a->display($c); ?> `
Make sure this area isn't contained within a DIV with the class "container." It should be flush with the edge of the page. That's because the container class will automatically be injected into the area, now that we know what grid framework we're using."
Hi hutman, siton, thanks for your replies.
I just fixed the problem by getting rid of the left and right padding in the .row but not sure if it is the final solution. Will update this tread if something comes up.
Thanks for your effort.
Cheers
erminos
I just fixed the problem by getting rid of the left and right padding in the .row but not sure if it is the final solution. Will update this tread if something comes up.
Thanks for your effort.
Cheers
erminos
Remove the container class. You dont need to change nothing beside this (read the docs)
Works very well by removing the container class.
Thanks for your support.
Thanks for your support.
