This depends on what theme your using. Usually you have to edit the CSS to fix the margin and/or padding between the DIVs or whatever is causing the extra space.
Ok, Im using the twenty twelve theme. Could anyone give me a example of what the code would look like! Thanks! The page is goodmusicinc.net
Okay, I think this should work. Find the below in your CSS page. (Go to Appearance, Editor, style.css (along the right). Find the following:
.entry-header .comments-link {
margin-top: 24px;
And change 24px to a smaller number, like 5px. The bad thing is that .comments-link will also become close to the top. Hopefully that doesn’t affect anything. If it does, you can change the CSS, so it only affects .entry-header.
Hopefully this works!
Doesn’t seem to be working. I have very little experience with this and I’m just using jetpacks css editor
Okay, do the same thing but find this:
.site-content article {
border-bottom: 4px double #ededed;
margin-bottom: 72px;
Where it says margin-bottom: 72px, change that to something smaller. What you did above was probably working but just not enough to make a difference. As you can see 72px, is a good, fat amount. 🙂 Hopefully this works. Also what is Jetpack’s CSS editor? I meant the one in WordPress admin by the way. 🙂
change the margin in this “.site-content article” class. This style sheet uses 2 values – px and rem.. You need to change both.
margin-bottom: 20px;
margin-bottom: 2.142857143rem;
.site-content article {
border-bottom: 4px double #ededed;
margin-bottom: 20px;
margin-bottom: 2.142857143rem;
padding-bottom: 24px;
padding-bottom: 0.2rem;
word-wrap: break-word;
-webkit-hyphens: auto;
-moz-hyphens: auto;
hyphens: auto;
}
Sweet that worked! Thanks! The editor allows you too put code into it and it will take precedence over any other relating code in the style sheet. If that makes any sense.
Andrew Nevins
(@anevins)
WCLDN 2018 Contributor | Volunteer support
That’s dependent on the CSS you use, not everything will override the original stylesheet. More importantly modifying theme’s files means those modifications will be erased when the theme updates and Jetpack’s Custom CSS option circumvents this.
Cool, glad it works. 🙂 I’ve never really had to look into this as I’ve only ever used themes I’ve coded so theme updates are my updates! haha
Probably a stupid question but what does rem stand for
rem comes from ‘root em’
http://www.w3.org/TR/css3-values/#rem-unit
Equal to the computed value of ‘font-size’ on the root element.
When specified on the ‘font-size’ property of the root element, the ‘rem’ units refer to the property’s initial value.
Jonathan Snook explains it well at: http://snook.ca/archives/html_and_css/font-size-with-rem
ok sweet. Thanks. I’m slowly picking this up but that was very helpful. My degree is in math with one class in coding needless to say this is pretty new to me. Would I want to use rem formating if i want my text to take up a certain percentage of a users screen? Like if they were on a laptop or 27 inch screen, would it relatively take up the same space? I’m asking this because I hope that I can configure my whole site to fit lets say 90% of a viewers screen with 10% being the background, 5 on each side.
It is best to have a px fallback when using rem for font size due to older browsers’ lack of support.
A font size defined using rem is relative to the font size defined for the html element. This is independent of the screen size.
To learn about how to best support different screen sizes, take a look at some articles on responsive web design to achieve a site layout that works for different screen sizes and devices. This is a good one to start with: http://coding.smashingmagazine.com/2011/01/12/guidelines-for-responsive-web-design/
Thanks so much!!! any chance you could help with this http://wordpress.org/support/topic/changing-color-of-text-2?replies=3
another question I asked.
