Jump to content
Sign in to follow this  
jdbrasesco

Boxes: How do I change padding for specific boxes on a page?

Recommended Posts

jdbrasesco

I'm trying to change the padding for specific boxes rather than globally for all boxes. My site is http://www.brasesco.com Here's what I tried in pagelines-customize/style.css

.home #fbox_645, #fbox_650, #fbox_653  {padding: 5px 5px 0px 5px}

It's not working. Do I have the syntax wrong? Thanks, J.D.

Share this post


Link to post
Share on other sites
Rob
J.D., I'm not really good with CSS. The only thing I can tell you about your CSS is that you don't need the px after 0 in any CSS unless it's 10px. Do you have Firebug for Firefox? That would help you identify the correct elements and CSS to change. Also, I'm unsure what padding you're trying to change. Is it between the boxes or inside the boxes between the border and the image?

Former PageLines Moderator, Food Expert and Raconteur

Share this post


Link to post
Share on other sites
jdbrasesco
@rangelone thanks for response. Yes, I am using Firebug which is how I found the names of the specific box elements (box_645, etc.). I am trying to change the padding within the box between the image and the box border. This is what I want: [url]http://brasesco.com/fotos/films/[/url] I got that using: [code] .page-id-844 .box-media-pad {padding: 5px 5px 0px 5px !important;} .page-id-844 .fboxgraphic {margin-bottom: 0px;} [/code] But on my home page I want to specify box_645, box_650 & box_653 and leave the other boxes on the page unaltered. Thanks, J.D.

Share this post


Link to post
Share on other sites
MrFent
Try: #fbox_645.fbox, #fbox_650.fbox, #fbox_653.fbox {padding: 5px 5px 0px 5px !important;}

Share this post


Link to post
Share on other sites
jdbrasesco
Thanks @mrfent Unfortunately it didn't quite work, but it got me on the right track. Here's what finally worked. Problem solved: [code] #boxes #fbox_645.fbox .box-media-pad {padding: 5px 5px 0px 5px !important;} #boxes #fbox_645.fbox .fboxgraphic {margin-bottom: 0px;} #boxes #fbox_650.fbox .box-media-pad {padding: 5px 5px 0px 5px !important;} #boxes #fbox_650.fbox .fboxgraphic {margin-bottom: 0px;} #boxes #fbox_653.fbox .box-media-pad {padding: 5px 5px 0px 5px !important;} #boxes #fbox_653.fbox .fboxgraphic {margin-bottom: 0px;} [/code]

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  

×