I want to remove white space between sections on my site
i.e features and content sidebar, content sidebar and morefoot.
I've tried a number of CSS options and nothing seems to be working.
Remove white space
Started by
jennalyn11
, Feb 17 2013 09:09 PM
Best Answer Rob , 02 March 2013 - 04:42 PM
Hi Jennalynn,
I can see you're trying hard to fix this. The content pad is key here, as is the minimum height of the dynamic content. There's no guaranty this will work, but, you might try something like the code below as an experiment (though this is for demonstration purposes only):
#morefoot .content .content-pad {
padding: 0 15px 15px;
}
#site #page, #site #dynamic-content {
min-height: 200px;
}
7 replies to this topic
#2
batman
-
- Members
- 992 posts
Bat Learning
- LocationBuenos Aires, Argentina
- Framework Version:2.4.2
-
Country:
Posted 17 February 2013 - 09:38 PM
Hi jennalyn11
You can try with
You change #px as you like, it is only an example.
You have more information at
#3
Danny
-
- Moderators
-
- 7,529 posts
Ninja
- LocationManchester, UK
-
Country:
Posted 18 February 2013 - 09:56 AM
Hi,
Although Batmans solution may work, using negative margins shouldn't really be used.
I recommend using Firebug or your browsers built-in web dev tools and inspect the content-pad class for each of your sections. The Content pad controls the padding of each section, you may also want to inspect the h1 tags and section, as there is margins on there which can increase the space between sections.
For assistance visit our custom CSS documentation -
#4
jennalyn11
-
- Members
- 33 posts
Advanced Member
-
Country:
Posted 01 March 2013 - 05:02 PM
Still having trouble with this, tried quiet a number of options and nothing seems to work. It's the white space between the feature and the morefoot sidebar I want to reduce?
#5
James B
-
- Moderators
-
- 2,470 posts
Advocate
- LocationSurrey - UK
-
Country:
Posted 01 March 2013 - 09:58 PM
Hi Jennaiyn
When you're looking in firebug and inspecting the element scroll through the html div's on the left hand side of the bottom browser window. As you do you'll see the changes in preview window above, highlighting each area you're looking at. When you get to the correct area which has the unwanted padding you'll see a thick blue margin like in the screenshot below.
This means you are hovering over the div which contains the padding you want to remove, click on this and then scroll through the css window on the right hand side, you will be able to see the css with the padding/margins applied in there. You can edit this and then copy/paste back into the custom code box in the framework.
Like in the screenshot below
#6
jennalyn11
-
- Members
- 33 posts
Advanced Member
-
Country:
Posted 02 March 2013 - 02:43 PM
I don't want to edit the entire content padding, it's just horizontal spacing ...
#7
Rob
-
- Moderators
-
- 9,436 posts
One Smart Egg
- LocationEast Coast, USA
- Framework Version:The Latest, of course
-
Country:
Posted 02 March 2013 - 04:42 PM Best Answer
Hi Jennalynn,
I can see you're trying hard to fix this. The content pad is key here, as is the minimum height of the dynamic content. There's no guaranty this will work, but, you might try something like the code below as an experiment (though this is for demonstration purposes only):
#8
jennalyn11
-
- Members
- 33 posts
Advanced Member
-
Country:
Posted 02 March 2013 - 05:52 PM
Thanks you that seems to have one the trick!
