Site-Title shows on hover logo

[Remco Heijnen]

Hi,

I'm building a site on the magazine pro theme. I have centered the logo. Cause its nice but... now when I hover with the mouse on top of the logo, the site-title appears and that is not so nice...

So I've tried to make it transparent in CSS but it doens't work. The site is not visible yet. But here is my code:

/*
Site Header
---------------------------------------------------------------------------------------------------- */

.primary-nav .site-header {
	padding-top: 85px;
}

.site-title a {
	color: transparent;
	background-position: center !important;
	background-size: contain !important;
	display: block;
	height: 151px;
	margin: 0 auto;
	max-width: 400px;
	
}

.site-title a:hover {
	color: transparent;
}

.site-header {
	text-align: center;
}

.site-header .wrap {
	border-bottom: 1px solid #222;
  	padding: 30px 0;
}

.header-image .site-header .wrap {
	padding: 0;
}

/* Title Area
--------------------------------------------- */

.site-description {
	color: transparent;
  	display: block;
	height: 0;
	margin-bottom: 0;
	text-indent: -9999px;
}

Am I missing something?

Thanks very much!

[Susan]

As you posted this a while ago, I hope you were able to get your issue resolved. If you were, please mark this thread "resolved", and we will close it.

If it has not been resolved, please report back here, and I try to escalate for you.

Thanks!

[Remco Heijnen]

not yet. I allmost forgot that I posted this. So I'm glad that you are here!

What can I do to fix it?

[Abland]

Hi, Remco,

Maybe make the rule important, too:

color: transparent !important;

[Remco Heijnen]

hi,

Of course! That worked fine. So simple, yet effective 🙂

Thnx!

[Author]

Posts