Any clues how to decrease the space beneath the word “Adoption” (in red) on this page and the buttons beneath it? I’ve tried Line Spacing. I’m using Stacks: FontStack (by Stacks4Stacks) and Button Press (by Doobox).
http://www.marc4change.org
Thanks in advance!
-Aaron
It looks as though the text there has a bottom margin of 1.25em - see attached screenshot. I can change it using ‘Inspect Element’ in Chrome but wouldn’t like to hazard how to target that specific element because to me it looks like that would change all the spaces at the end of every paragraph.
I’m sure it’s relatively easy and that someone with more CSS skill than I can help you out.
Rob
Thanks for your reply. Indeed that seems to affect the whole page; I’m wondering if I can target the space of that specific area only. Strange. 
I’m sure you can Aaron. Just needs someone with more CSS skills than I.
I wish there was an idiot-proof tool that let you isolate stuff like this so you could apply the CSS to the right bit.
Rob
There are a couple of ways. The simplest would be to change the bottom margin of the paragraph p to use REM units and not EM units.
p {
margin-bottom: 1.25rem;
}
If you want to target just that single stack then you could do it by the stack ID:
#stacks_in_24973_page0 p {
margin-bottom: 1.25rem;
}Wow! Thank you so much! Y’all AMAZE me!
Oh! Question while we’re at it, if you’re willing… Any way to make the underline go away in the front page Headlines (porting in from Armadillo blog)?
Try this:
.armadilloBlogHeadlineEntry a,.armadilloBlogHeadlineEntry a:visited {
text-decoration: none;
}OMG! You guys rock! Thank you!
If you’ve got the time and inclination Doug, can you explain how you concluded which was the correct stack ID to use?
I’d have said it was 24974, for example…and why choose the ‘stacks_in’ variant of 24973, rather than the ‘stacks_out’ one?
Many thanks
Rob
Rob (@robbeattie),
In this case, the 24974 was on a span element, which contained a paragraph. The <span> is an inline element, a <p> (paragraph) is a block-level element. From a syntax point of view (W3C Specs), that span should have been a <div>, an inline element should not have contained a block level element.
It would have worked being on the span since most all browsers forgive a lot of syntax errors, including that one.
As for stack-in vs. stacks-out, as a rule, I don’t like applying custom CSS to either. It’s an assigned value, if you move the stack to another page, place it in a partial, copy it to another page, or copy it to another project the value changes. So six months down the road, you decide to move that section to a different page, now any custom CSS applied to using the stack ID stops working.
Unfortunately, most stacks don’t allow you add a user assigned ID or a CSS Class name. You could place the code inside something like Joe Workmans CSS Box stack.
In the example above were using A descendant selector in CSS. That will apply the CSS to any paragraph that is a descendant of any element that has the ID on it. So you could have used the id from the stacks-in or stacks-out and it would have worked. You could have even gone up the parent chain farther, and apply it to the entire row:
#stacks_in_24959_page0 p {
margin-bottom: 1.25rem;
}
I always recommend puting it in Joe’s free CSS box stack that allows you to add your own ID or class to the contents.
Many thanks for the detailed explanation. And for suggesting Joe’s CSS Box stack. I might try and experiment with that. Good idea.
Cheers
Rob
This topic was automatically closed 6 days after the last reply. New replies are no longer allowed.
