center an image with a link on it center an image with a link on it wordpress wordpress

center an image with a link on it


in aligncenter class add text-align:center

.aligncenter {    clear: both;    display: block;    margin-left: auto;    margin-right: auto;    text-align:center;}


I'm not familiar with wordpress, but you might want to try setting the image's and the anchors's css 'display' property to 'inline-block'.

If you are limited in changing the document's DOM, another option is adding an 'onClick' attribute to the image.
This will allow you to run some function once the image is clicked.
So, for example, if you want to redirect to another page:

<img src='myImg.png' onclick='myRedirect()' style='cursor:pointer'/>

And in the page's header:

<script type='text/JavaScript'>    var myRedirect = function(){        window.location.href = 'Some other location';    }</script>

Notice the style='cursor:pointer', which changes the mouse's cursor to a 'hand' cursor.


To avoid an additional div container or even JavaScript, you can make the anchor display as a block:

.logo {display: block; height: 115px; margin: 0 auto; width: 115px;}

/* height and width must equal your image's values */

<a href="#" class="logo"><img src="logo.png" alt="Logo" /></a>

Live demo: http://jsfiddle.net/performancecode/Ggk8v/