0

Sorry, I know this kind of question has been asked before but I can't quite figure it out.

I'm trying to hide the city image on this page:

http://learnenglish20.com/buy-tokens/

I put this CSS in my child theme:

 body.page-id-2557 #title-content { 
 display: none !important; 

}

I think maybe I've got my class wrong? Anyway, I'd really appreciate any help

closed as off-topic by TheDeadMedic, Mayeenul Islam, Howdy_McGee, kaiser May 10 '16 at 1:20

This question appears to be off-topic. The users who voted to close gave this specific reason:

If this question can be reworded to fit the rules in the help center, please edit the question.

  • Welcome to WPSE, @Race Reed. title-content is a class, not an id. Just change the # for a dot (.). And, please, remember this CSS related questions, even if are about a WordPress blog, should go to Stackoverflow. – Luis Sanz Apr 29 '16 at 11:13
1

Just override the background property with the below code in your child css.

#title {
    background: none !important;
}
  • 1
    This would set the background image for all pages to none, it wouldn't be specific for that page. – Howard E Apr 29 '16 at 13:39
1

It should look like this:

.page-id-2557 section#title {
   background: none !important;
}

This removes the image, then you may want to change the color of the title

Which you'd have to also use !important, since this theme uses !important a lot, which isn't great... try to avoid.

.page-id-2557 #title.title-area .title-content .title-text h1 {
    color: #FFA23B !important;
}
  • He didn't say. To hide just the image, he'd have to do this: page-id-2557 #title { background: none !important; } and use !important, since the image itself is declared with the Important and then change the color of the text. – Howard E Apr 29 '16 at 13:29
  • Good improvement, will delete my comments except this one (till tomorrow). – flomei Apr 29 '16 at 16:21
  • This one did it . page-id-2557 section#title { display: none !important; } Thanks fellows – Race Reed May 4 '16 at 9:16
  • @RaceReed if you like the answer...could you up vote it? – Howard E May 4 '16 at 9:58
0

It seems you want to hide the logo image that's displayed instead of the site title. Check the image element in source code and then add the custom class to the specific element.

A second option would be to create a custom page template, and then use it while publishing that particular page.

0

You could use background-position and just move it out of the view of the element.

element.class{
  background-position:-9999px;
}

or

element.class{
  background:transparent;
}
  • Don´t move it, that´s not a clean solution. – flomei Apr 29 '16 at 13:24
  • why this is not a clean solution ? please define – Owais Alam Apr 29 '16 at 13:30
  • On the one hand: If you want to hide/remove things you either make them transparent or set them to display:none, so they don´t collide with other elements. But that´s more philosophical, perhaps. On the other hand: Have you tried your CSS? It has no effect, as the background image size is set to cover and standard browser behaviour is to tile the image then. That´s what happens in my Chrome. – flomei Apr 29 '16 at 13:37
  • Ok my friend i have tried Version 50.0.2661.94 m of google chrome but its good for information at your chrome version its not support so its not browser compatible. – Owais Alam Apr 29 '16 at 13:46
  • Yeah, my Chrome 49.0.2623.112 m is probably totally outdated... – flomei Apr 29 '16 at 13:52

Not the answer you're looking for? Browse other questions tagged or ask your own question.