removing white space between posts

ThemeShaper Forums » Thematic

[closed]

removing white space between posts

(11 posts)

Started 12 years ago by davidonformosa
Latest reply from davidonformosa
This topic is resolved

Tags:

white space

davidonformosa
Member

I want to know how to reduce the white space between posts and between the header and post heading.

My child theme is not live yet, but I have posted a screenshot with annotation at http://twitpic.com/4u4f01

Posted 12 years ago #
lastraw
Member

Modify the padding or margin of your post heading in your child theme's style.css. Use firebug to see the line of code that needs to be changed.

Posted 12 years ago #
davidonformosa
Member

At present it seems the CSS for this part of the page is:

#main {
clear: both;
padding: 66px 0 22px 0;
}

I changed the value of padding in style.css to

15px 0 22px 0;

but this didn't seem to have any effect on reducing the white space.

Posted 12 years ago #
boden
Member

this issue would be easier to address if you provided a live page so the DOM/CSS could be inspected.

Posted 12 years ago #
helgatheviking
Moderator
live links are quite helpful. but i am looking at my local install and there are two places that i think you could mean:

there is a 22px bottom padding on .hentry
```
hentry {
padding: 0 0 22px 0;
}
```
as well as a 44px bottom margin on the .entry-utility
```
.entry-utility {
clear: both;
color: #666;
font-size: 13px;
line-height: 18px;
margin: 0 0 44px 0;
}
```
overwriting/removing those should reduce the space between posts
Posted 12 years ago #
davidonformosa
Member

I installed the Theme Test Drive plugin so others can check what the code looks like. The child theme can be viewed at http://blog.taiwan-guide.org/?theme=david-thematic

Anyway I changed the values in style.css to

.hentry {
padding: 0 0 5px 0;
}
.entry-utility {
clear: both;
color: #666;
font-size: 13px;
line-height: 18px;
margin: 0 0 5px 0;
}

but this didn't seem to significantly reduce the white space.

Posted 12 years ago #
middlesister
Member

I think it is the padding on #main that you want to change. I didn't see any change in firebug when I followed your link. It still says padding:66px 0 22px, taken from default.css. Are you sure you added the css code to the right place? It should be in your child theme's style.css file.

Posted 12 years ago #
davidonformosa
Member

I removed the #main and replaced it with the code for .hentry and .entry-utility in the child theme's style.css file.

Posted 12 years ago #
middlesister
Member

But I don't see that either. According to firebug, the only declarations in style.css apart from the @import statements are #blog-title a and #branding. At least when I follow the link you posted.

Posted 12 years ago #
joperron
Member

You should copy Thematic's default.css into your child theme's style.css and remove this from style.css too:

@import url('../thematic/library/styles/default.css');

It makes it so much easier to edit and find solutions to things like this, your comments also aren't closed properly (/* = no good)

Posted 12 years ago #
davidonformosa
Member

@joperron, I copied default.css into the child theme's style.css and removed the line of code as you suggested. I also cleaned up the closing of the comments. Thanks.

It's looking more like I want it to now. Thanks to all for your help.

Posted 12 years ago #

RSS feed for this topic

Topic Closed

This topic has been closed to new replies.