Struggling to implement a CSS image rollover on a Wordpress header logo. The solution may be simple for you experts, but I can't find it anywhere on Stackoverflow. Could it have something to do with the position? Adding :relative or :absolute doesn't seem to make any difference.
Check out my CSS below:
#top {
height: 105px;
padding-left: 10px;
padding-top:27px;
}
#logo {
/* background-attachment: scroll;
background-image: url(images/logo.png);
background-repeat: no-repeat;
background-position: left top;*/
height: 70px;
width: 461px;
}
#logo a:hover {
background-attachment: scroll;
background-image: url('images/flatgrey.png');
background-repeat: no-repeat;
background-position: left top;*/
height: 70px;
width: 461px;
}
#logo a {
display:block;
height: 70px;
width: 461px;
& PHP
<body <?php body_class(); ?>>
<div id="outer">
<div id="top">
<div id="logo">
<?php
ob_start();
ob_implicit_flush(0);
echo get_option('imbalance_custom_logo');
$my_logo = ob_get_contents();
ob_end_clean();
if (
$my_logo == ''
): ?>
<a href="<?php bloginfo("url"); ?>/">
<img src="<?php bloginfo('template_url'); ? >/images/logo.png" alt="<?php bloginfo('name'); ?>" /></a>
<?php else: ?>
<a href="<?php bloginfo("url"); ?>/"><img src="<?php echo get_option('imbalance_custom_logo'); ?>" alt="<?php bloginfo('name'); ?>" /></a>
<?php endif ?>