Simon Varwell

Brilliant, thanks Jeremy, very much appreciated.

Thankfully my chances of using Jetpack in Japanese are consistently slim.

Brilliant, thank you Jitendra, you’re a star.

That’s solved it perfectly!

Thanks so much Jitendra.

I already have the following in my CSS StyleSsheet Editor. Does this change the situation? Or do I just add one or both of what you wrote at the bottom?

body .site-title {
	position: static !important;
	font-weight: bold;
	margin-top: 1em;
}

.site-title a {
	color: black;
}

/* Mobile by default*/
body .site-title {
	font-size: 140%;
}

/* Desktop by media query */
@media screen and (min-width: 800px) {
	body .site-title {
		font-size: 3.1em;
	}
}

Hi Esmi. It’s Expound, downloaded directly from WordPress via my website.

Marvellous, that’s cracked it, the header looks great now. Thanks so much Andrew, your help and patience is very much appreciated.

It’s given me a bit of understanding about how CSS works too. Thanks again.

Nope, I’m afraid that still leaves the text off-kilter to the right on the smallest screen size (iPhone portrait, and fully narrowed desktop).

All that code does is remove the extra page title text, leaving me back where I was.

It doesn’t resize it in relation to the screen (the text is the same size whatever), but it does fit into the smallest resolution (albeit to the right, partly hanging off the edge of the screen.

Do I need to tell it something in terms of margins or alignment?

Done. Aha, thanks Andrew, I see what that does.

One slight quibble, though, in that the text is longer than the shortest page width (iPhone, portrait) and so rather clumsily stretches off the page.

So is it just a case of experimentally reducing the font size a bit, until it fits?

Yes, thanks, I can. Don’t know what to do with it, but I can access it!

I’m not sure. I’m afraid. I have “Edit CSS” and “Editor” under the Appearance heading in the dashboard, if that’s a help. And no, I don’t have a Child Theme set up.

Sorry Andrew, I don’t know what hiding/unhiding in CSS means, or what difference that would make. And I refer you to the second part of my original query, where I reported that I was unable to open or edit CSS files.

The issue is that my banner as it stands cuts off text (which is incorporated in into the image) when a desktop browser is narrowed, or if the page is viewed in a portrait iPad or on an iPhone. I hope that makes sense.

One workaround could be for me to just move the text to within the area that the smallest width covers, though again if there are other things I could do I’d be grateful to hear.

Ah. Good point. Thanks Andrew. No, I wouldn’t be OK with all that white space.

I suppose therefore it would be simplest to redo my header in such a way that its layout fits all the screen sizes I can think of.

Do I have any other obvious options? For instance, is it possible for the image to respond not in equal proportion?