Visual theme: weird spacing between image, Heading, and content

nilla2014 · Member · Jan 23, 2017 at 8:55 pm
Copy link

Add topic to favorites
Hi,

For some weird reason, a chunk of spacing displays between my image, Headings, and content in this post (see Angarrack and Newlyn):
Southwest England and on to Cherbourg (Frane)

I’ve tried to remove and re-load image, place it in different spots, but nothing seems to work.

Any thoughts?

Many thanks!

The blog I need help with is: (visible only to logged in users)
staff-loquaciousloon · Staff · Jan 27, 2017 at 3:08 pm
Copy link
Hi there!

The space you’re seeing is happening because you’ve used an h3 tag. Headings (h1 through h6) are what we call clearing elements – meaning they start a new line, and don’t wrap around floated elements, like your right aligned image.

It looks like you have Custom CSS active on your site – you could try adding this style to prevent headings inside your posts from clearing:
```
.entry-content h1
.entry-content h2,
.entry-content h3,
.entry-content h4,
.entry-content h5,
.entry-content h6 {
    clear: none;
}
```
That should do the trick, without affecting other headings outside of your posts :)
nilla2014 · Member · Feb 7, 2017 at 3:16 pm
Copy link
Hi, this didn’t work and still have the weird spacing.
staff-loquaciousloon · Staff · Feb 7, 2017 at 4:08 pm
Copy link
It looks like you were missing the clear: none; part, and had just this in your CSS:
```
.entry-content h1
.entry-content h2,
.entry-content h3,
.entry-content h4,
.entry-content h5,
.entry-content h6 {
}
```
I’ve added clear: none; in there to make sure it’s working properly, and it looks good now, can you check again? :)
nilla2014 · Member · Feb 7, 2017 at 4:15 pm
Copy link
Hi,

Fantastic and thanks for doing that for me. I’ll have to be extra careful next time. :)
staff-loquaciousloon · Staff · Feb 7, 2017 at 4:18 pm
Copy link
No problem! CSS can be picky sometimes :)

No items found.