Jump to content
Sign in to follow this  
antonella

How can I change width and margin of the feature boxes

Recommended Posts

antonella

Hello, I'm delving into the Pagelines framework for a new site and trying to get it up and running (I'm coming from Platform Pro on other sites). I'd like to increase the margin between the feature boxes on the home page and reduce the width. I've tried using firebug to isolate the CSS, but can't seem to find the correct ids and classes. Can someone direct me to the elements I should be using? I saw something with grid-element and pp3, but not sure how to combine them. Thanks.

Share this post


Link to post
Share on other sites
Danny
Hi Antonella, I dont think its margin you're after but padding. Therefore, try this and see if this works for you. [code]#features .content-pad {padding: 3em;}[/code]

Please search our forums, before posting!

Share this post


Link to post
Share on other sites
antonella
Thanks, I meant margin or padding. But I don't want the large features box to be changed, I want to control the three smaller boxes that appear below. Sorry for the confusion.

Share this post


Link to post
Share on other sites
Danny
Hi, OK sorry I misunderstood, would it be possible to provide a screenshot of how you want the boxes to look. I will then be able to assist you.

Please search our forums, before posting!

Share this post


Link to post
Share on other sites
antonella
I've attached a screeshot. I've marked up in magenta a rough idea. I would like to add more space between the boxes, which means also reducing the width. So I have to figure out how to change the margin and the box width. I just couldn't tell what in the CSS is controlling that margin nor the width. [img]http://earlymusicbesalu.com/site/EarlyMusic-home2012-03-12%2013-06-25.png[/img] Thanks so much!

Share this post


Link to post
Share on other sites
antonella
still haven't been able to locate the fix...

Share this post


Link to post
Share on other sites
WebWerx
Try this: .fboxinfo { overflow-x: hidden; overflow-y: hidden; padding-bottom: 0; padding-left: 10px; padding-right: 10px; padding-top: 5px; play with the left and/or right padding

Share this post


Link to post
Share on other sites
catrina
To supplement WebWerx's reply, please refer to this documentation on padding: http://w3schools.com/css/css_padding.asp

Please read the docs before posting. Please do not private message me unless I ask you to.

Designer | Catrina Dulay

Founder | Catrina and Mouse

Share this post


Link to post
Share on other sites
antonella
Webwerx - Thank you Thank you! That worked. What exactly does the overflow property do? Is it hiding the extra margin so it doesn't push down?

Share this post


Link to post
Share on other sites
WebWerx
@antonella: http://www.w3schools.com/cssref/pr_pos_overflow.asp

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  

×