• 0
Sign in to follow this  
Followers 0

iBox space issue


Question

Posted (edited) · Report post

I am trying to get sections properly spaced and centered. Why do I see a big empty space in the iBox section?  It makes it hard to align these sections.

 

Here is a link to the screen shot I took: http://d.pr/i/6Qqb

 

And here is a link to the site: http://www.xploreproductions.com/

 

thanks!

 

And ignore the funky pie wedges.  Im having trouble with sizing on those, but that is a whole other topic!

Edited by twosis

Share this post


Link to post
Share on other sites

11 answers to this question

  • 0

Posted · Report post

Hi,

 

Your problem is with the number 12.   The boxes are based on the Twitter Bootstrap Responsive Grid. That uses the number 12 as its basis.  So, if you're going to imagine 12 columns, and then grouping them into boxes, you're merging some of those 12 into little groups.

 

So, to make 3 boxes, each is 4 individual columns.  You have them set as 3 columns, 3 boxes, thus you only use 9 columns out of 12, leaving a gap of 3 columns.  Look at the image you shared with James.  Where it says "Number of Columns for each Box (12 Col Grid)" you will see 3.  When you edit the boxes, change that value to 4.   If you want 4 boxes, change the Number of Columns value at 3.

 

See http://docs.pagelines.com/tutorials/responsive-grid

1 person likes this

Share this post


Link to post
Share on other sites
  • 0

Posted · Report post

Hi there,

 

Have you checked the settings for the ibox section? I can replicate the same type of setup if they're not set correctly - http://screencast.com/t/rmDiBLhb

 

Can you post a screen shot of the ibox settings for us so we can replicate your setup and work out where it needs to be corrected. 

1 person likes this

Share this post


Link to post
Share on other sites
  • 0

Posted · Report post

Hi James - thanks for looking at this.  Here is the screenshot of the settings: http://d.pr/i/rycS

Share this post


Link to post
Share on other sites
  • 0

Posted · Report post

A very belated reply in thanks Rob!  Appreciate the link for further knowledge as well :-)

1 person likes this

Share this post


Link to post
Share on other sites
  • 0

Posted · Report post

You're very welcome, as always!

Share this post


Link to post
Share on other sites
  • 0

Posted · Report post

I understand how the 12 column grid works, but I'm not sure I know how to configure this for 5 items (a number that 12 is not divisible by). If I set iBox to 2-columns per box, then my iBox grid is aligned to the left (since 5x2=10, I get an extra 2 gird units to the right). If I set the column width to 3, then iBox forces the last item to a new line.

 

Any suggestions would be appreciated.

 

Thanks,

Mike

Share this post


Link to post
Share on other sites
  • 0

Posted · Report post

Hi Mike,

 

To do this you will most likely need to use the offset option to adjust the position of your iBox section. Offset can be found just next to the decrease/increase width options.

Share this post


Link to post
Share on other sites
  • 0

Posted · Report post

Danny I've done this to compensate, but of course that means I will also ave to decrease the size of the section so that I can offset it. Not ideal. It would be better if the whole section could be centered.

Share this post


Link to post
Share on other sites
  • 0

Posted · Report post

Not sure why it's not ideal, as 5 iBoxes wont fill the full width area anyway, so reducing the width shouldn't make any difference ?

Share this post


Link to post
Share on other sites
  • 0

Posted · Report post

Danny try it out and you'll see what I mean. In order to offset to the right, then entire ibox section was to be reduced, which in turn reduces the size of the individual ibox icons.

Share this post


Link to post
Share on other sites
  • 0

Posted · Report post

OK, well you can't have 5 in one row, as the grid doesn't support it. The only alternative is for you to display 4 on one row and one on another.

 

You may be thinking to your self, why is there even an option for 5, well thats in case a user wants to display 5 or more boxes in one column, like so

 

http://d.pr/i/GusK

Share this post


Link to post
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!


Register a new account

Sign in

Already have an account? Sign in here.


Sign In Now
Sign in to follow this  
Followers 0