Page 1 of 1
columns width
Posted: 04 May 2017, 04:31
by laxina
Hi again, I have a question of the columns width, please check out the image attached.
I set up the Context width as WIDE, but the color bars I made are not wide to touch the edge of the page, their is big margin though.
I am not familiar with code, maybe I made mistake, using wrong code, but please help :)
thanks
Re: columns width
Posted: 04 May 2017, 06:27
by mjau-mjau
I can't see anything wrong in your code. It just looks like the CONTEXT module is NOT wide for some reason ... I would need a link to diagnose why it is not wide.
Re: columns width
Posted: 04 May 2017, 09:06
by laxina
I am sorry, I am setting up the site in my local server, haven't make it public yet, don't know how to share it to you now.
but let me make more screenshot for you now, you can see the text goes to edge of the page, as what WIDE does.
Re: columns width
Posted: 04 May 2017, 09:14
by laxina
i just tried this with a total new X3 installation, still have the same problem.
Re: columns width
Posted: 04 May 2017, 10:32
by mjau-mjau
I kinda forgot, the
"row" class naturally creates a limited width (
max-width: 71.25rem) to the container where it is applied. This is just how it works, based on the
foundation grid. You can easily overcome it by simply omitting the "row" class, for example:
<div>
<div class="small-6 columns" style="background-color:green">1</div>
<div class="small-6 columns" style="background-color:red">2</div>
</div>
Alternatively, you reset the "max-width" style specifically for the row:
<div class="row" style="max-width: none;">
<div class="small-6 columns" style="background-color:green">1</div>
<div class="small-6 columns" style="background-color:red">2</div>
</div>
Re: columns width
Posted: 04 May 2017, 20:41
by laxina
great, it works, thanks a lot, and thanks a lot for the quick reply as always.