Reverse CSS Property

Associate
Joined
20 May 2007
Posts
441
Hey all,

I'm having a little trouble picturing how this can be achieved without messing around with my blog styling a lot so thought I'd ask you guys before doing some trial and error approach.

Basically I have this post with a small image that I would like centered:

Screenshot-GauntFace-MatthewGaunt-GoogleChrome.png


The HTML code for this is:

<p>
<a href="http://www.gauntface.co.uk/blog/wp-content/uploads/2010/04/boot.png">
<img class="aligncenter size-full wp-image-485" title="Ubuntu New Brand Logo" src="http://www.gauntface.co.uk/blog/wp-content/uploads/2010/04/boot.png" alt="" width="512" height="300">
</a>
</p>

The only way I can seem to get the image centred is by setting the paragraph tag to text-align:center.

So the all important question is, can anyone think of a way of saying any image in a paragraph tag (whether surrounded with a link or not) should be centred? Which kind of feels like I want to say a rule of: if this p tag has a link and an image or just an image apply this rule to it (i.e. reverse of how CSS rules work)

It's not important but I just get a little frustrated when I can't get things like this doing what I please.
 
Can you not remove the class "aligncenter size-full wp-image-485" then apply something like:

Code:
p img { margin: 0 auto }
 
I have tried that and it didn't work :-/

As for the "aligncenter size-full wp-image-485" stuff, that's just added by wordpress but it's a custom theme that doesn't actually style any of these elements.
 
Unfortunately they are different, but thanks for the suggestion.

I think it will be easiest to just go back to the wordpress editor and make the small tweak in some of the latest posts, its just a pain :mad:

Thanks for the help everyone
 
Put the image alone into a new div tag and make that centered in the CSS file?

In my experience, the only way to override other CSS, is to make a new div
 
Back
Top Bottom