Trouble with .page-title and menu

Someone really has to be able to look at your site to answer questions like this — so can you post a link to it?

In general, use Firebug to see what CSS code is actually affecting the html code.

oh god sorry, its at iamparaic.com

Just noticed it looks perfect in firefox (latest version), which is the only browser it works in

1) If you’re talking about the big “Home”, “About” and “Contact” text, they are showing because they are within the element “entry-title”, not “page-title”. In fact, I can’t find a “page-title” element in your site.

First off, you really should use a child theme if you want to modify the default theme — otherwise you will lose all your changes when you update WP and you also need a clean copy of the default theme for trouble-shooting purposes.

There is no class of .page-title so that’s why that does not work. I’m assuming you mean the large Home (vs. the site name and tagline in the header section)? If so, it’s .entry-title that you need to add display: none; to — line 700 — but you will just need to put this in your new child theme:

.entry-title {
display: none;
}

So far as the menu, if you use -30px for the top, it does move it above the header — but then you might also want to increase the margin-top in the #page CSS (right now it’s set to 1em on line 74) But I’m not sure using CSS to move the menu is the best way to go.

You might want to look for a theme that already has the menu at the top of the page — less likely to have problems with it; or modify the layout in the header.php file.

2) Give nav#access a width, like 100%

but I have entry-title set to:

.entry-title {
	clear: both;
	color: #484848;
	font-size: 20px;
	font-weight: bold;
	line-height: 1.5em;
	padding-bottom: .6em;
	padding-top: 10px;
}

so why doesn’t this apply to the page title’s as well? That formating is only on the blog title’s…

Thanks for the tips on the menu positioning, I’ll just have to keep toying around with it and see. Whats REALLY annoying me is that it’s find in Firefox…

You are defining those rules to anything with the class entry-title. The display: none; you are writing is assigned to an element with the class page-title. Curiously, there are no elements with that class on your page. You can add that class by editing your theme’s relevant template file and then you will see (or, rather, not see) them styled as you need.

Does this make sense?

There is no such class as .page-title. If you want to change the titles in the header, look for:

#site-title and #site-description

Those are the IDs that correspond to that content.

This is a good CSS resource: https://www.w3schools.com/css/default.asp.

@fwoan: Yeah I understand what your saying about there being no class called page-title. And I can see that the title’s “Home” “About” etc are classed as entry-title, I just don’t understand why it’s not taking the entry-title formatting which the blog post titles are taking… I hope im explaining that right?

@wpyogi: I’ve had no problems editing the site-title or description, thanks to a little helping hand from here :). It’s the large “home” and “about” etc etc on each page that I need to edit but they don’t seem to respond to anything I change

Paraic,
This is because you have a more specific rule that is overwriting the rules you showed above.

.singular .entry-title { is overwriting it in your style.css on line 1061.

As a Web Developer, I try to keep all styles group by what they are affecting. That way rules aren’t scattered all over. Also as WPyogi pointed out, Firebug will make this a 10 second problem to diagnose.

You absolute legend, thank you so much for your time!

.singular .entry-title controls the titles of the pages then,

title issue solved!!!

Glad to help.

I almost feel bad asking but would you know which lines control the “Category Archives: Blog” at the top of the blog page and the reviews page?

I’d like to hide them aswell. Only just noticed it