Fixing the padding and keeping it consistent

Question

I'm working on my cargo collective website (http://www.omarayoub.com) and I'm trying to keep the top padding consistent across the different sections and pages.

My goal is to make the top padding of an image (or a headline) to be exactly 25px. This is proving difficult for the following reasons:

If I change the top margin to 0px in the:

.project_content img {
    margin:0px 15px 15px 0;

and the top padding to 0px in the:

.entry {
    border-top:1px solid transparent;
    clear:both;
    padding:0px 0 90px 0;

The first poster's padding works, as well as the second one. But the third poster (Twin Peaks) has no top padding at all. Also, the "About" image has no top padding either.

As a work around, I changed the top margin to -25px in:

.project_content img {
    margin:-25px 15px 15px 0;

and the top padding to 25px in:

.entry {
    border-top:1px solid transparent;
    clear:both;
    padding:25px 0 90px 0;

This way, the "About" image has the correct top padding, but the third poster (Twin Peaks) has no top padding at all. If there's no way to make all the top paddings = 25px, how can I at least fix the (Twin Peaks) one?

pardon my ignorance, how do I remove it? I can't find it in the css code.. — Omar, Jan 09 '14 at 23:32
It's html. You'll need to remove the tag from the HTML then remove that negative margin you added in the CSS. — davidpauljunior, Jan 09 '14 at 23:33
with Cargo I don't have access to html save for a small window with limited code.. I don't even know how a
tag got there in the first place — Omar, Jan 09 '14 at 23:37
I deleted the whole entry and reposted and the
tag is still there.. — Omar, Jan 09 '14 at 23:40
But there's no break tag in the second item? Are you able to 'view source' in the editor of the code in that entry? If so, you should be able to remove the `
` there — davidpauljunior, Jan 09 '14 at 23:47
Nothing.. I can't find it anywhere.. Anyway thank you for your time, I appreciate it. — Omar, Jan 10 '14 at 00:06

score 1 · Accepted Answer · answered Jan 10 '14 at 00:14

The problem is not padding, but is because of a <br> tag in the html.

enter image description here

Ideally, you should remove that from the HTML, but following the comments above, it appears these are being added probably by the WYSIWYG editor and you can't stop them occurring.

So you could try hiding that <br> tag with CSS. This is not ideal, but it's a suggestion.

.project_content br:first-child {
  display: none;
}

Then remove your negative margin on the image.

Fixing the padding and keeping it consistent

1 Answers1