Jump to content
Sign in to follow this  
francierandolph

Padding between elements

Recommended Posts

francierandolph

Hello, Each time I add a new element to my PlatformPro site, I get a large margin of padding vertically between the elements (i.e. between feature boxes, highlights, carousels, main text areas, etc.) (see my homepage: www.sustainablecape.org). I would like to reduce the padding to give the site a more cohesive look. I've read the discussion here: http://www.pagelines.com/forum/discussion/3941/how-to-remove-spaces-inside-widgets/p1, but like the individual there I'm having trouble finding where this padding is written in the code. I'm looking in: Dashboard>Appearance>Editor>Stylesheet, but I've also looked through the code of most of the templates in the Editor section to no avail. I have used Developer Tools in Chrome. I'm new to this so it's definitely possible that I'm missing something obvious. Any help you could give would be great! Thank you! -Catherine

Share this post


Link to post
Share on other sites
Danny
Hi Catherine, Please add the following code to your custom CSS. [code]#highlight .hl-image-bottom {margin: 0em;} #highlight .content-pad .highlight-area {padding: 0px 15px 15px;} #carousel .content-pad {margin: 0;}[/code]

Please search our forums, before posting!

Share this post


Link to post
Share on other sites
francierandolph
Hi Danny, Thanks for your help! I added the code to Platform Pro>Custom Code>CSS Rules: ([code]Body{#highlight .hl-image-bottom {margin: 0em;} #highlight .content-pad .highlight-area {padding: 0px 15px 15px;} #carousel .content-pad {margin: 0;}} [code]), and saved options, but unfortunately the padding is still there: www.sustainablecape.org. Is there anything else I could try? Thank you!!

Share this post


Link to post
Share on other sites
francierandolph
whoops I apparently double pasted there...sorry! Forget everything after "Thank you!!"

Share this post


Link to post
Share on other sites
gyoery
top area: .highlight-area {padding:0px;} text area on main page: .mcolumn-pad {padding:0px;} carousel: #carousel {padding:0px;} /* only a bit at the bottom*/ .thecarousel {padding:0px;} /*almost all padding around the carousel*/ On your pages: Branding area: #branding .content-pad {padding:0px;} try these, and report back if u need more spaces removed. Also on your Programs page there is no navigation or back button. You might want to look into that.

Share this post


Link to post
Share on other sites
francierandolph
Hi Gyoery, I'm unfortunately still not seeing any change in the appearance of my site. I put this code in the custom CSS section: body{ #highlight .hl-image-bottom {margin: 0em;} #highlight .content-pad .highlight-area {padding: 0px 0px 0px;} #carousel .content-pad .carousel-area {padding:0px;} /* only a bit at the bottom*/ .thecarousel {padding:0px;} /*almost all padding around the carousel*/}} .mcolumn-pad {padding:0px;} } Am I doing something wrong? Thanks for your help!

Share this post


Link to post
Share on other sites
Jenny
The body {} code is default. It can be safely removed. However, you're NOT going to want to use the .mcolumn-pad {padding:0px;} as that will remove the padding from all .mcolumn-pad's on the site (and there are a LOT). Try using Danny's suggestion (getting rid of the body {}), so you should just have [code]#highlight .hl-image-bottom {margin: 0em;} #highlight .content-pad .highlight-area {padding: 0px 15px 15px;} #carousel .content-pad {margin: 0;}[/code] In your CSS code. Keep in mind we can't design your site for you so if you need CSS help, make sure you've downloaded [url="http://www.getfirebug.com"]Firebug for Firefox[/url] and check out [url="http://www.w3schools.com/"]W3 Schools[/url] for more info. Also please be sure to watch our Firebug video tutorial [url="http://www.pagelines.com/wiki/Custom_CSS"]here[/url]. If your site requires customization, you may wish to consider requesting a quote from one of our authorized Professional designers by visiting [url="http://www.pagelines.com/pros/"]our Pros page[/url].

Jenny :: Web designer at Simple Mama (follow me at @simplemamacom)

Check out Share Me, a social sharing add-on for DMS that is super simple to set up.

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  

×