WP, need different background for p and img

[Ranger]

okay, so I want to put a different background image behind my images than my other (text) p elements. I can get a background behind the images using the img selector, but the problem is that is also inside of a p element, so any background i put on the p elements also gets put behind the img’s. So does anyone know of a way to put a background behind just the normal p elemnts (as in the post text/paragraphs) and not behind the post images? Am I making sense?
I’m working on this site, if that helps
thanks

[AntonNiklasson]

Create a pen at http://www.codepen.io and try to isolate your problem. Makes it a lot easier for any forum member to help.

[wolfcry911]

@AntonNiklasson, I may be in the minority, but I respectfully disagree with you. I find a link to an actual live page/site is far better than a test bed. If a live page is not available, then I agree and think a test bed is better than just posting code (or worse an image, or still worse just trying to describe the problem).

@Ranger, I’m not a wordpress guy, but I can think of three things you could try. The simplest is to use a caption on the image. I believe WP will then wrap the image in a div instead of p. The caption could be just a single space, or you could use CSS to hide the caption with .wp-caption-text {display: none}.

The second thing you could do is use jquery to add a class to p’s that have img.

$(document).ready(function() {

$('p').has('img').addClass('image');

});

should work.

The third and most technical would be to edit the functions.php so that images would be wrapped in an element of your chosing.

// img unautop

function img_unautop($pee) {

$pee = preg_replace('/
\s*?(<\/a>|)?\s*<\/p>/s', '
$1
', $pee);

return $pee;

}

add_filter( 'the_content', 'img_unautop', 30 );

courtesy Robert O’Rourke

[Paulie_D]

I’m not a WordPress expert or anything but it seems to me that something is fundamentally wrong if it’s wrapping individual ‘posts’ in p tags.

Surely these should be wrapped in divs with a class of ‘post’ which then contains paragraphs and images etc.

[Ranger]

@wolfcry911, I’ll give that a try. If I can successfully get the images wrapped in divs instead of p’s, that would be great.

@Paulie_D, As far as I’m aware, everything in a wordpress post is wrapped in it’s own p tag. It’s true the post as a whole is wrapped in it’s own div, but each element inside is wrapped in a p tag including each paragraph and image. (images also have an img tag inside said p tag).

[Author]

Posts